Merge branch 'main' into release/update-carbon-deps

.github/ISSUE_TEMPLATE/accessibility-issue.md

@@ -5,6 +5,7 @@ title: ''
 type: 'bug'
 labels: ['type: a11y ♿', 'status: needs triage 🕵️‍♀️']
 assignees: ''
+projects: ['carbon-design-system/39']
 ---
 
 <!-- Feel free to remove sections that aren't relevant.

.github/ISSUE_TEMPLATE/bug-report.md

@@ -5,6 +5,7 @@ title: ''
 type: 'bug'
 labels: ['type: bug 🐛', 'status: needs triage 🕵️‍♀️']
 assignees: ''
+projects: ['carbon-design-system/39']
 ---
 
 <!-- Feel free to remove sections that aren't relevant.

.github/ISSUE_TEMPLATE/component-accessibility-deliverables.yaml

@@ -3,6 +3,7 @@ description: Submit the accessibility portion of your component
 title: '[Component name] component – accessibility '
 type: 'task'
 labels: ['accessibility', 'status: needs triage 🕵️‍♀️']
+projects: ['carbon-design-system/39']
 body:
   - type: markdown
     attributes:

.github/ISSUE_TEMPLATE/docs-issue.yaml

@@ -4,6 +4,7 @@ description:
 title: '[Docs]: '
 type: 'bug'
 labels: ['type: bug 🐛', 'type: docs 📖', 'status: needs triage 🕵️‍♀️']
+projects: ['carbon-design-system/39']
 body:
   - type: markdown
     attributes:

.github/ISSUE_TEMPLATE/feature-request.md

@@ -5,6 +5,7 @@ title: ''
 type: 'enhancement'
 labels: ['type: enhancement 💡', 'status: needs triage 🕵️‍♀️']
 assignees: ''
+projects: ['carbon-design-system/39']
 ---
 
 Use this template if you want to request a new feature, or a change to an

.github/ISSUE_TEMPLATE/feedback.md

@@ -4,6 +4,7 @@ about: User feedback collected from the Carbon Design System Website.
 type: 'task'
 labels: ['type: discussion 💬', 'status: needs triage 🕵️‍♀️']
 assignees: ''
+projects: ['carbon-design-system/39']
 ---
 
 <!--

.github/ISSUE_TEMPLATE/question.md

@@ -5,6 +5,7 @@ title: ''
 type: 'task'
 labels: ['type: question ❓', 'status: needs triage 🕵️‍♀️']
 assignees: ''
+projects: ['carbon-design-system/39']
 ---
 
 <!--

.github/workflows/issue-triage.yml

@@ -25,11 +25,6 @@ jobs:
     runs-on: ubuntu-latest
     if: ${{ github.event_name == 'issues' && github.event.action == 'opened' }}
     steps:
-      - uses: actions/create-github-app-token@v1
-        id: app-token
-        with:
-          app-id: ${{ secrets.APP_ID }}
-          private-key: ${{ secrets.APP_PRIVATE_KEY }}
       - name: Get issue ID
         id: get_issue_id
         run: |
@@ -40,10 +35,12 @@ jobs:
             fi
             echo "Issue ID is $ISSUE_ID"
             echo "issue_id=$ISSUE_ID" >> "$GITHUB_OUTPUT"
+        env:
+          GH_TOKEN: ${{ secrets.ADD_TO_PROJECT_PAT }}
       - name: Update issue with website area field
         run:
           gh project item-edit --project-id $PROJECT_ID --id $ISSUE_ID
           --field-id $AREA_FIELD_ID --single-select-option-id $AREA_WEBSITE
         env:
-          GH_TOKEN: ${{ steps.app-token.outputs.token }}
+          GH_TOKEN: ${{ secrets.ADD_TO_PROJECT_PAT }}
           $ISSUE_ID: ${{ steps.get_issue_id.outputs.issue_id }}

src/pages/elements/color/overview.mdx

@@ -286,7 +286,7 @@ dark components to light backgrounds. This technique is useful to focus
 attention or create visual tension. Some high contrast moments are baked into
 the themes by using the `inverse` tokens, like the tooltip component. Other
 times high contrast moments can be achieved through applying
-[inline theming](/guidelines/color/usage#inline-theming) for instances like a
+[inline theming](/elements/color/usage/#inline-theming) for instances like a
 dark UI Shell Header with a light theme page.
 
 <DoDontRow>
@@ -320,8 +320,7 @@ the assigned value will change with the theme. For example, under the hood
 the `$text-secondary` token can dynamically map to `Gray 70` or `Gray 30`
 depending on the theme.
 
-See the [tokens](/guidelines/color/tokens) tab for the full list of color
-tokens.
+See the [Tokens](/elements/color/tokens/) tab for the full list of color tokens.
 
 ### Token names
 
@@ -360,7 +359,7 @@ and `$interactive`.
 
 Some core tokens are part of an additional token group called _layering tokens_.
 These tokens are used to implement the layering model onto components. For more
-information, see the [usage tab](/guidelines/color/usage#layering-tokens).
+information, see the [Usage](/elements/color/usage/) tab.
 
 | Token group | Applied to                                                                          |
 | ----------- | ----------------------------------------------------------------------------------- |
@@ -383,7 +382,7 @@ Some components have their own specific color tokens, known as _component
 tokens_. They represent the properties associated with a particular component.
 They are not global tokens like the core tokens and should never be used for
 anything other than their own component. For a full list for component tokens
-see the [tokens](/guidelines/color/tokens)tab.
+see the [Tokens](/elements/color/tokens/) tab.
 
 To see how the tokens are applied in the components themselves, visit the
 component’s style page.

src/pages/elements/color/usage.mdx

@@ -27,8 +27,8 @@ needs.
 ## Implementing layering
 
 There are two ways to implement the
-[layering model](/guidelines/color/overview#layering-model) in a theme, either
-by using explicit tokens or contextual tokens. These techniques can be used
+[layering model](/elements/color/usage/#layering-tokens) in a theme, either by
+using explicit tokens or contextual tokens. These techniques can be used
 independently in a product or can be used together. Both methods produce the
 same visual result, the difference lays in how you develop with them. Designers
 only need to be concerned with the layering tokens.
@@ -83,7 +83,7 @@ color (excluding interaction colors) is another layer and will require the use
 of a different set of layering tokens.
 
 For more information about how color token migration works, see the
-[migration guide](/migrating/guide/design#color-tokens).
+[migration guide](/migrating/guide/design/).
 
 #### Layer sets
 
@@ -104,7 +104,7 @@ pair with its same number, for example `$field-03` pairs with
 
 Not all color tokens are part of a layer set. Some tokens groups, like `text`
 and `icon`, work across layers. For a list of the layering tokens, see the color
-[usage tab](/guidelines/color/usage).
+[Tokens](/elements/color/tokens/#layer) tab.
 
 <Row>
 <Column colLg={8}>
@@ -570,7 +570,7 @@ Mixing themes inline is still allowed with light or dark mode. Mixing inline
 theme contrast between elements in different modes is also allowed. It is very
 common for products to have side panels or UI shell elements be high contrast in
 light mode but low contrast in dark mode. These relationships can be mapped in
-code using the the
+code using the
 [theme component](https://react.carbondesignsystem.com/?path=/docs/components-theme--default).
 Note that smaller components built with an inverse tokens (like tooltip) should
 remain high contrast when switching modes.
@@ -600,8 +600,9 @@ images for modes is to use transparent backgrounds.
 <InlineNotification>
 
 **Additional guidance:** Checkout some helpful PAL guidance around how to
-properly treat illustrations, images, and pictograms in light or dark mode on
-[IBM Cloud PAL](https://pages.github.ibm.com/ibmcloud/pal/dark-mode-guidelines/designers/#illustrations-in-dark-mode),
+properly treat some components, iconography, and illustrations in light or dark
+mode on
+[Carbon for Cloud](https://pages.github.ibm.com/ibmcloud/design-operations/carbon-for-cloud/developing/dark-mode-guidelines/theming),
 _for IBMers only_.
 
 </InlineNotification>

src/pages/migrating/guide/design.mdx

@@ -44,7 +44,7 @@ accessibility, collaboration, and efficiency for users.
 
 | Design tool                                                          | v11                      | Migration strategy                                                                                                                                                                                                                                                                                                                                                                                |
 | -------------------------------------------------------------------- | ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| [Figma](/designing/kits/figma)                                       | Update available         | The v11 Figma update is available as a new library with all themes in one file. See the [Design Kit Figma tab](https://carbondesignsystem.com/designing/kits/figma/) for more information. Teams need to swap out assets from v10 to v11 assets to migrate. The v10 Figma files will not receive continuous updates and will remain permanently on v10.                                           |
+| [Figma](/designing/kits/figma)                                       | Update available         | The v11 Figma update is available as a new library with all themes in one file. See the [Design Kit Figma](https://carbondesignsystem.com/designing/kits/figma/) tab for more information. Teams need to swap out assets from v10 to v11 assets to migrate. The v10 Figma files will not receive continuous updates and will remain permanently on v10.                                           |
 | [Sketch](/designing/kits/sketch)                                     | Update available         | The same Sketch Cloud libraries that were used in v10 have been updated to include the v11 changes. Do not accept the library update until you are ready to work in v11. There are new [v10](https://v10.carbondesignsystem.com/designing/kits/sketch#get-the-kit) libraries available for teams that still need them. Note that Sketch kits will not be prioritized or maintained in the future. |
 | [Adobe XD](https://github.com/IBM/design-kit/tree/master/Adobe%20XD) | Partial update available | Some of the v11 changes have been made in the XD files, available in GitHub. Note that Adobe XD kits will no longer be prioritized or maintained.                                                                                                                                                                                                                                                 |
 
@@ -77,8 +77,8 @@ buttons. Actionable notifications can be styled like an inline or toast
 notification.
 
 See Carbon's
-[actionable notification](/components/notification/usage/#actionable-notifications)
-usage guidance for more information.
+[actionable notification](/components/notification/usage/#actionable) usage
+guidance for more information.
 
 <Row>
 
@@ -146,7 +146,8 @@ modifiers—tabs with icons, icon-only tabs, and secondary labels. Additionally,
 there is a new third alignment option for tab that allows for auto-widths where
 each tab size is determined by the label length.
 
-See Carbon's [tab](/components/tabs/usage/) usage guidance for more information.
+See Carbon's [tabs](/components/tabs/usage/) usage guidance for more
+information.
 
 <Row>
 <Column colLg={8}>
@@ -191,8 +192,8 @@ work as a unified collection in v11. As a result of this convergence, type token
 names have been renamed to better define their relationship to one another and
 reflect its styling.
 
-See Carbon's [typography](/guidelines/typography/styling-strategies) guidance
-for more information.
+See Carbon's [typography](/elements/typography/style-strategies/) guidance for
+more information.
 
 ### Compact styles
 
@@ -257,7 +258,7 @@ adjective descriptor in place of the number ending to help users better
 understand how a token should be used. The new naming convention is as follows:
 `[element] - [role] - [order] - [state]`
 
-See Carbon's [color overview](/guidelines/color/overview/) guidance for more
+See Carbon's [color overview](/elements/color/overview/) guidance for more
 information.
 
 <Row>
@@ -281,8 +282,7 @@ developer concern. **In Sketch, and other design tools, designer will only use
 the layering tokens to design.** The layering tokens replace what were the `ui`
 color tokens in v10 and are used in a similar way.
 
-See Carbon's [color implementation](/guidelines/color/implementation) guidance
-for more information.
+See Carbon's [color usage](/elements/color/usage) guidance for more information.
 
 <Row>
 <Column colLg={12}>
@@ -319,8 +319,8 @@ allows themes to be nested within each other without needing custom styles or
 overrides. In product, a common use-case for inline theming is applying a
 contrasting theme to a UI shell and side panels.
 
-See Carbon's [inline theming](/guidelines/color/implementation#inline-theming)
-guidance for more information.
+See Carbon's [inline theming](/elements/color/usage/#inline-theming) guidance
+for more information.
 
 <Row>
 <Column colLg={8}>
@@ -337,8 +337,7 @@ the end user to choose a UI that is either predominately light or dark in color.
 The UI will automatically switch from using light color backgrounds with dark
 color text to using dark color backgrounds with light color text.
 
-See Carbon's
-[light or dark mode](/guidelines/color/implementation#light-or-dark-mode)
+See Carbon's [light or dark mode](/elements/color/usage/#light-or-dark-mode)
 guidance for more information.
 
 <Row>