docs(deprecations): add new page including upcoming deprecation detai…

…ls (#4301)

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

* chore: update references to v10 and deprecated packages

* docs(deprecation): add v10 elements packages and carbon-icons

src/pages/all-about-carbon/releases.mdx

@@ -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 */}

src/pages/all-about-carbon/who-uses-carbon.mdx

@@ -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)

src/pages/deprecations.mdx

@@ -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 `[email protected]`, the
+[v11 migration guide](/migrating/guide/develop/) has all the details of how to
+update.
+
+For those using `[email protected]`, 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 `[email protected]`, the
+[v11 migration guide](/migrating/guide/develop/) has all the details of how to
+update.
+
+For those using `[email protected]`, 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/).

src/pages/elements/2x-grid/overview.mdx

@@ -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 |

src/pages/elements/color/code.mdx

@@ -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" />

src/pages/elements/color/overview.mdx

@@ -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" />

src/pages/elements/icons/code.mdx

@@ -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" />
@@ -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" />

src/pages/elements/icons/usage.mdx

@@ -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" />
@@ -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" />

src/pages/elements/motion/overview.mdx

@@ -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.
 
@@ -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" />

src/pages/elements/pictograms/code.mdx

@@ -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" />

src/pages/elements/pictograms/usage.mdx

@@ -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)

src/pages/elements/spacing/code.mdx

@@ -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" />

src/pages/elements/themes/overview.mdx

@@ -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" />

src/pages/elements/typography/code.mdx

@@ -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" />

src/pages/elements/typography/overview.mdx

@@ -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" />
@@ -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" />

src/pages/index.mdx

@@ -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" />
@@ -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>
@@ -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>

src/pages/migrating/faq.mdx

@@ -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?
 

src/pages/migrating/guide/develop.mdx

@@ -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