diff --git a/DEPRECATIONS-v2.md b/DEPRECATIONS-v2.md new file mode 100644 index 0000000000..aa8607447d --- /dev/null +++ b/DEPRECATIONS-v2.md @@ -0,0 +1,21 @@ +# Deprecations + +Introducing deprecations and feature flags to be removed in the version 2 lists. + +💁 Please follow these steps to safely upgrade your Design System to Spirit Design System v2 components. + +## spirit-web v2 + +- [Deprecations](./packages/web/DEPRECATIONS-v2.md) + +## spirit-web-react v2 + +- [Deprecations](./packages/web-react/DEPRECATIONS-v2.md) + +## spirit-web-twig v2 + +- _spirit-web-twig_ was released as version 2 already + +--- + +Please refer back to this list or reach out to our team if you encounter any issues during migration. diff --git a/DEPRECATIONS-v3.md b/DEPRECATIONS-v3.md new file mode 100644 index 0000000000..e206a819da --- /dev/null +++ b/DEPRECATIONS-v3.md @@ -0,0 +1,13 @@ +# Deprecations + +Introducing deprecations and feature flags to be removed in the version 3 lists. + +💁 Please follow these steps to safely upgrade your Design System to Spirit Design System v3 components. + +## spirit-web-twig v3 + +- [Deprecations](./packages/web-twig/DEPRECATIONS-v3.md) + +--- + +Please refer back to this list or reach out to our team if you encounter any issues during migration. diff --git a/packages/web/DEPRECATIONS-v2.md b/packages/web/DEPRECATIONS-v2.md index 87eb7f6dd4..ea1b638862 100644 --- a/packages/web/DEPRECATIONS-v2.md +++ b/packages/web/DEPRECATIONS-v2.md @@ -25,29 +25,20 @@ uniform variant will be enabled by default. The feature flag enabling the data selector controlled placement (`data-spirit-placement-controlled`) for tooltip will be removed and the data selector controlled placement will be enabled by default. -## Deprecations - -### Dropdown Combined Placements - -Combined placement classes for dropdown will be removed. +### Alert Bordered -#### Migration Guide - -Instead of using `.Dropdown--bottom.Dropdown--left`, use `.Dropdown--bottomLeft` and so on. +The feature flag enabling the bordered variant of alert will be removed and the bordered variant will +be enabled by default. -- `.Dropdown--top.Dropdown--left` → `.Dropdown--topLeft` -- `.Dropdown--top.Dropdown--right` → `.Dropdown--topRight` -- `.Dropdown--bottom.Dropdown--left` → `.Dropdown--bottomLeft` -- `.Dropdown--bottom.Dropdown--right` → `.Dropdown--bottomRight` -- `.Dropdown--left.Dropdown--top` → `.Dropdown--leftTop` -- `.Dropdown--left.Dropdown--bottom` → `.Dropdown--leftBottom` -- `.Dropdown--right.Dropdown--top` → `.Dropdown--rightTop` -- `.Dropdown--right.Dropdown--bottom` → `.Dropdown--rightBottom` +## Deprecations ### Tooltip and Dropdown Placement Classes Placement classes for Tooltip and Dropdown will be removed. +See also other Tooltip and Dropdown [placement deprecation](#tooltip-and-dropdown-placements) and +[combined placement deprecation](#dropdown-combined-placements). + #### Migration Guide Instead of using `Tooltip--top` or `Tooltip--topLeft` or `Dropdown--top` or `Dropdown--topLeft`, @@ -80,7 +71,10 @@ use data attribute like`data-spirit-placement="top"` or `data-spirit-placement=" ### Tooltip and Dropdown Placements -The `Tooltip` and `Dropdown` components will no longer support non-flows placements. +The `Tooltip` and `Dropdown` components will no longer support non-flows relative placements. + +See also other Tooltip and Dropdown [placement classes deprecation](#tooltip-and-dropdown-placement-classes) +and [combined placement deprecation](#dropdown-combined-placements). #### Migration Guide @@ -105,13 +99,33 @@ for more details. - `.Dropdown--rightTop` → `data-spirit-placement="right-start"` - `.Dropdown--rightBottom` → `data-spirit-placement="right-end"` +### Dropdown Combined Placements + +Combined placement classes for dropdown will be removed. + +See also other Dropdown [placement classes deprecation](#tooltip-and-dropdown-placement-classes) +and [placement deprecation](#tooltip-and-dropdown-placements). + +#### Migration Guide + +Instead of using `.Dropdown--bottom.Dropdown--left`, use combination `bottom-start` in placement data attribute. + +- `.Dropdown--top.Dropdown--left` → `data-spirit-placement="top-start"` +- `.Dropdown--top.Dropdown--right` → `data-spirit-placement="top-end"` +- `.Dropdown--bottom.Dropdown--left` → `data-spirit-placement="bottom-start"` +- `.Dropdown--bottom.Dropdown--right` → `data-spirit-placement="bottom-end"` +- `.Dropdown--left.Dropdown--top` → `data-spirit-placement="left-start"` +- `.Dropdown--left.Dropdown--bottom` → `data-spirit-placement="left-end"` +- `.Dropdown--right.Dropdown--top` → `data-spirit-placement="right-start"` +- `.Dropdown--right.Dropdown--bottom` → `data-spirit-placement="right-end"` + ### Modal (Non)Scrollable The `.ModalDialog--nonScrollable` modifier will be removed and the ModalDialog will be made non-scrollable by default. #### Migration Guide -In a new version, to make the ModalDialog scrollable, use the `.ModalDialog--scrollable` modifier class. +In the new version, use the `.ModalDialog--scrollable` modifier class to make the ModalDialog scrollable. - `.ModalDialog` → `.ModalDialog .ModalDialog--scrollable`