Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(deprecations): add new page including upcoming deprecation details #4301

Merged
merged 6 commits into from
Sep 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/pages/all-about-carbon/releases.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@ redesign product UIs and begin a migration plan to comply with IBM brand
experience standards. For more details about this release, see our
[v10 release page](https://v10.carbondesignsystem.com/help/migration-guide/overview).

As of September 30, 2024, all v10 assets have been deprecated.

## Release history

{/* prettier-ignore-start */}
Expand Down
1 change: 0 additions & 1 deletion src/pages/all-about-carbon/who-uses-carbon.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -280,5 +280,4 @@ Here are some ways people in support roles can begin engaging with Carbon:

- Report issues in these primary support Slack channels:
- [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/)
- [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD)
- [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G)
128 changes: 128 additions & 0 deletions src/pages/deprecations.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
---
title: Deprecations
description:
Stay informed on deprecated packages and assets in the Carbon Design System
with updates, migration guides, and resources for seamless transitions to the
latest supported versions.
---

<PageDescription>

Stay informed on deprecated packages and assets in the Carbon Design System with
updates, migration guides, and resources for seamless transitions to the latest
supported versions.

</PageDescription>

<AnchorLinks>

<AnchorLink>carbon-components</AnchorLink>
<AnchorLink>carbon-components-react</AnchorLink>
<AnchorLink>v10 Elements packages</AnchorLink>
<AnchorLink>carbon-icons</AnchorLink>

</AnchorLinks>

## `carbon-components`

`carbon-components` reached it's end of support on September 30, 2024. This
package will no longer receive updates.

### What to use instead

`carbon-components` is replaced by `@carbon/styles`, but most projects don't
need to install `@carbon/styles` directly.

If you're using `@carbon/react` or `@carbon/web-components`, you do not need to
install `@carbon/styles`. All `@carbon/styles` assets are already available to
you through those framework-specific packages.

Library authors should use `@carbon/styles` if they do not already rely on a
framework-variant package such as `@carbon/react`.

### Migration

For those using `carbon-components@10.x`, the
[v11 migration guide](/migrating/guide/develop/) has all the details of how to
update.

For those using `carbon-components@11.x`, these versions are already a direct
re-export of `@carbon/styles`. See the above section on what to use instead.

For questions regarding this deprecation or how to migrate,
[contact us](/help/contact-us/).

## `carbon-components-react`

`carbon-components-react` reached it's end of support on September 30, 2024.
This package will no longer receive updates.

### What to use instead

`carbon-components-react` is replaced by `@carbon/react`.

### Migration

For those using `carbon-components-react@7.x`, the
[v11 migration guide](/migrating/guide/develop/) has all the details of how to
update.

For those using `carbon-components-react@8.x`, these versions are already a
direct re-export of `@carbon/react`. After installing `@carbon/react`, you can
replace all imports and usages of `carbon-components-react` with
`@carbon/react`. This should be an in-place update with no other changes
required.

For questions regarding this deprecation or how to migrate,
[contact us](/help/contact-us/).

## v10 Elements packages

All v10 assets reached end of support on September 30, 2024, including v10.x
ranges of elements packages. This includes:

- '@carbon/colors@10.x'
- '@carbon/elements@10.x'
- '@carbon/grid@10.x'
- '@carbon/layout@10.x'
- '@carbon/motion@10.x'
- '@carbon/themes@10.x'
- '@carbon/type@10.x'

### What to use instead

The v11.x ranges of these packages should be used instead.

### Migration

The [v11 migration guide](/migrating/guide/develop/) has all the details of how
to update.

For questions regarding these deprecations or how to migrate,
[contact us](/help/contact-us/).

## `carbon-icons`

The `carbon-icons` package reached end of support on March 31, 2022 when v11 was
released. This package will no longer receive updates.

### What to use instead

To use icons from the Carbon Design System, you should install the appropriate
library to use with your framework:

| Package | Framework | Link |
| :---------------------- | :----------------- | :------------------------------------------------------ |
| `@carbon/icons-react` | React | [Link](https://npmjs.com/package/@carbon/icons-react) |
| `@carbon/icons-angular` | Angular | [Link](https://npmjs.com/package/@carbon/icons-angular) |
| `@carbon/icons-vue` | Vue | [Link](https://npmjs.com/package/@carbon/icons-vue) |
| `carbon-icons-svelte` | Svelte | [Link](https://npmjs.com/package/carbon-icons-svelte) |
| `@carbon/icons` | Vanilla JavaScript | [Link](https://npmjs.com/package/@carbon/icons) |

### Migration

The [v11 migration guide](/migrating/guide/develop/) has all the details of how
to update.

For questions regarding these deprecations or how to migrate,
[contact us](/help/contact-us/).
2 changes: 1 addition & 1 deletion src/pages/elements/2x-grid/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ breakpoints.

Create custom breakpoints to accommodate special needs, by writing your own
media queries and CSS rules. Refer to the
[grid code package](https://github.com/carbon-design-system/carbon/tree/v10/packages/grid)
[grid code package](https://github.com/carbon-design-system/carbon/tree/main/packages/grid)
for more information.

| Breakpoint | Value (px/rem) | Columns | Size (%) | Size | Padding | Margin |
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/color/code.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ warmGray100; // Using the `warmGray100` variable.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon color package"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/colors"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/colors"
>

<MdxIcon name="github" />
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/color/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -651,7 +651,7 @@ to achieve commonly used contrast ratios between any two colors.
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Elements package: Color"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/colors"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/colors"
>

<MdxIcon name="github" />
Expand Down
4 changes: 2 additions & 2 deletions src/pages/elements/icons/code.mdx
tay1orjones marked this conversation as resolved.
Show resolved Hide resolved
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@ browsers like Internet Explorer 11 by setting `focusable` to `true`.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon icons package"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/icons"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/icons"
>

<MdxIcon name="bee" />
Expand All @@ -169,7 +169,7 @@ browsers like Internet Explorer 11 by setting `focusable` to `true`.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Icon package demo"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/icons"
href="https://carbon-elements.netlify.app/icons/examples/preview/"
>

<MdxIcon name="bee" />
Expand Down
4 changes: 2 additions & 2 deletions src/pages/elements/icons/usage.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ important information.
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Elements package: Icons"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/icons"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/icons"
>

<MdxIcon name="github" />
Expand All @@ -43,7 +43,7 @@ important information.
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Elements package: Icons-React"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/icons-react"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/icons-react"
>

<MdxIcon name="github" />
Expand Down
4 changes: 2 additions & 2 deletions src/pages/elements/motion/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@ that it would come to rest just outside the view, and ready to be recalled.
### Summary on easing

The
[IBM motion package](https://github.com/carbon-design-system/carbon/tree/v10/packages/motion)
[IBM motion package](https://github.com/carbon-design-system/carbon/tree/main/packages/motion)
has the easing curves stored for fast access. This is the recommended method to
call an easing curve and stay connected to receive any future updates.

Expand Down Expand Up @@ -371,7 +371,7 @@ statically.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Elements package: Motion"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/motion"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/motion"
>

<MdxIcon name="github" />
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/pictograms/code.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ browsers like Internet Explorer 11 by setting `focusable` to `true`.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon pictograms package"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/pictograms-react"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/pictograms-react"
>

<MdxIcon name="bee" />
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/pictograms/usage.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ become an elegant addition to the IBM experience.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="IBM pictograms (.svg)"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/pictograms/src/svg"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/pictograms/src/svg"
>

![GitHub Icon](../../../images/resource-cards/github.png)
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/spacing/code.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ following:
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon layout package"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/layout"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/layout"
>

<MdxIcon name="bee" />
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/themes/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ changing for each individual theme.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon themes package"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/themes"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/themes"
>

<MdxIcon name="github" />
Expand Down
2 changes: 1 addition & 1 deletion src/pages/elements/typography/code.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ function:
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Carbon type package"
href="https://github.com/carbon-design-system/carbon/blob/v10/packages/type"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/type"
>

<MdxIcon name="bee" />
Expand Down
4 changes: 2 additions & 2 deletions src/pages/elements/typography/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -221,7 +221,7 @@ for primary actions.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Elements package: Type"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/type"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/type"
>

<MdxIcon name="github" />
Expand All @@ -231,7 +231,7 @@ for primary actions.
<Column colMd={4} colLg={4} noGutterSm>
<ResourceCard
subTitle="Type package preview"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/type"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/type"
>

<MdxIcon name="codesandbox" />
Expand Down
14 changes: 2 additions & 12 deletions src/pages/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ building websites and user interfaces.
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Carbon React components"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/react"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/react"
>

<MdxIcon name="github" />
Expand All @@ -85,16 +85,6 @@ building websites and user interfaces.
href="https://github.com/IBM/carbon-components-angular"
>

<MdxIcon name="github" />

</ResourceCard>
</Column>
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Carbon Vanilla components"
href="https://github.com/carbon-design-system/carbon/tree/v10/packages/components"
>

<MdxIcon name="github" />

</ResourceCard>
Expand All @@ -121,7 +111,7 @@ building websites and user interfaces.
<Column colLg={4} colMd={4} noGutterSm>
<ResourceCard
subTitle="Carbon Web Components"
href="https://github.com/carbon-design-system/carbon-web-components"
href="https://github.com/carbon-design-system/carbon/tree/main/packages/web-components"
>
<MdxIcon name="github" />
</ResourceCard>
Expand Down
18 changes: 5 additions & 13 deletions src/pages/migrating/faq.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -60,22 +60,14 @@ description:

### Do I need to update right away? If not, when will we need to update?

- Carbon v11 includes functionality that may be a motivator for migration, but
teams can migrate to v11 when they have the bandwidth.

- Teams that are using v10 today can continue to stay on v10 and everything that
is implemented will continue to work.
- As of September 30, 2024 all v10 assets are deprecated and will not receive
any more updates.

### What will the Carbon team be supporting for v10?

- No new functionality will be introduced in v10 after the v11 release.

- We will continue to address high impact bugs that come up for the v10 release
after the v11 release.

- We will continue to accept any contributions that look to address issues in
the v10 release if we are unable to get to them in time for your product
roadmap.
- v10 reached it's end of support on September 30, 2024.
- `carbon-components` and `carbon-components-react` are now
[deprecated](/deprecations).

### What is the rule for supporting deprecated assets?

Expand Down
5 changes: 2 additions & 3 deletions src/pages/migrating/guide/develop.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -48,9 +48,8 @@ If you were previously using `carbon-components`, the styles from this package
are available under `@carbon/styles`. They are also re-exported through
`@carbon/react`

Both the `carbon-components` and `carbon-components-react` packages will stick
around in v11 but they are only re-exports of `@carbon/styles` and
`@carbon/react` respectively.
Both the `carbon-components` and `carbon-components-react` packages are now
[deprecated](/deprecations).

## Migrating a React app or library

Expand Down
Loading