Release 10.9.0

.github/ISSUE_TEMPLATE/bug_report.md

@@ -5,47 +5,48 @@ about: Create a report to help us improve
 
 <!--- Provide a general summary of the issue in the Title above -->
 
-**Describe the bug**
+## Describe the bug
 
 Provide a more detailed introduction to the issue itself, and why you consider it to be a bug.
 
-**To Reproduce**
+## To Reproduce
+
 Steps to reproduce the behavior:
 
 1. Go to '...'
 2. Click on '....'
 3. Scroll down to '....'
 4. See error
 
-**Expected behavior**
+## Expected behavior
 
 A clear and concise description of what you expected to happen.
 
-**Actual behavior**
+## Actual behavior
 
 A clear and concise description of what actually happened.
 
-**Possible fix**
+## Possible fix
 
 Not obligatory, but suggest a fix or reason for the bug.
 
-**Screenshots**
+## Screenshots
 
 If applicable, add screenshots to help explain your problem.
 
-**Desktop (please complete the following information):**
+## Desktop (please complete the following information):
 
--   OS: [e.g. iOS]
--   Browser [e.g. chrome, safari]
--   Version [e.g. 22]
+- OS: [e.g. iOS]
+- Browser [e.g. chrome, safari]
+- Version [e.g. 22]
 
-**Smartphone (please complete the following information):**
+## Smartphone (please complete the following information):
 
--   Device: [e.g. iPhone6]
--   OS: [e.g. iOS8.1]
--   Browser [e.g. stock browser, safari]
--   Version [e.g. 22]
+- Device: [e.g. iPhone6]
+- OS: [e.g. iOS8.1]
+- Browser [e.g. stock browser, safari]
+- Version [e.g. 22]
 
-**Additional context**
+## Additional context
 
 Add any other context about the problem here.

.github/workflows/janitor.yml

@@ -11,7 +11,7 @@ jobs:
     outputs:
       branchname: ${{ steps.branch.outputs.BRANCH_TO_DELETE }}
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 0
 
@@ -32,7 +32,7 @@ jobs:
       matrix:
         brand: ["payex", "swedbankpay"]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 2
         # Set brand specific variables

.github/workflows/main.yml

@@ -14,17 +14,17 @@ jobs:
       matrix:
         brand: ["payex", "swedbankpay"]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # Set brand specific variables
       - name: Environment variables
         id: variables
         run: ./.github/scripts/variables.sh --brand ${{ matrix.brand }} --ref ${{ github.ref }}
 
-      - name: Set Node.js 16.x
-        uses: actions/setup-node@v3
+      - name: Set Node.js 18.x
+        uses: actions/setup-node@v4
         with:
-          node-version: 16.x
+          node-version: 18.x
 
       - name: Cache dependencies
         uses: actions/cache@v3

.github/workflows/playwright.yml

@@ -11,10 +11,10 @@ jobs:
     timeout-minutes: 60
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 18
       - name: Install dependencies
         run: npm ci
       - name: Install Playwright Browsers

.github/workflows/pull-request.yml

@@ -9,17 +9,17 @@ jobs:
       matrix:
         brand: ["payex", "swedbankpay"]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # Set brand specific variables
       - name: Environment variables
         id: variables
         run: ./.github/scripts/variables.sh --brand ${{ matrix.brand }} --ref ${{ github.ref }}
 
-      - name: Set Node.js 16.x
-        uses: actions/setup-node@v3
+      - name: Set Node.js 18.x
+        uses: actions/setup-node@v4
         with:
-          node-version: 16.x
+          node-version: 18.x
 
       - name: Cache dependencies
         uses: actions/cache@v3

.github/workflows/tag.yml

@@ -12,7 +12,7 @@ jobs:
       matrix:
         brand: ["payex", "swedbankpay"]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # Set brand specific variables
       - name: Environment variables
@@ -25,10 +25,10 @@ jobs:
         env:
           TOKEN: ${{ secrets.SENTRY_TOKEN }}
 
-      - name: Set Node.js 16.x
-        uses: actions/setup-node@v3
+      - name: Set Node.js 18.x
+        uses: actions/setup-node@v4
         with:
-          node-version: 16.x
+          node-version: 18.x
           cache: npm
 
       - name: Install
@@ -66,11 +66,11 @@ jobs:
     needs: build
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 18
           cache: npm
 
       - name: Install
@@ -79,7 +79,7 @@ jobs:
       - name: Build
         run: npm run build:prod -- --env github_actions=true
 
-      - uses: JS-DevTools/npm-publish@v2
+      - uses: JS-DevTools/npm-publish@v3
         with:
           token: ${{ secrets.NPM_TOKEN }}
           access: "public"

README.md

@@ -172,7 +172,7 @@ Before merging to master to create a release, make sure you follow these steps:
 
   - then run `npm i` to also update package-lock
 
-  - run `npx browserslist@latest --update-db` to update browserslist
+  - run `npx update-browserslist-db@latest` to update browserslist
 
 - Make sure the `RELEASE_NOTES.md` is correct (date and version) and only contains changes for the current release
 

RELEASE_NOTES.md

@@ -1,17 +1,26 @@
 # Changelog
 
-## \[10.8.7\] - 07.11.2023
-
-## Bug Fixes
+## \[10.9.0\] - 24.11.2023
 
 ## Component changes
 
-- Topbar - v2 experimental stage - disabled by default (migration involves breaking changes)
-
 ### Non breaking UI changes
 
-## Testing
+- Typography
+
+  - update typography values (line-heights)
+  - add text-wrap balance for headings & pretty for paragraphs (progressive enhancement)
+
+- Colors ( & colors utilities):
+
+  - some colors variables got updated
+  - removed the possibility to combine text-color utility classes WITH `.text-muted` to decrease their opacity
+  - `.text-muted` class still exist, but it will always mean a full opacity color
+
+## Maintenance
+
+- npm packages dependencies upgrades
 
 ## Design System website
 
-- Add the new Playbook section in Identity
+- Update the Identity/Colors page for SwedbankPay side