Release 3.6.0

.github/workflows/patchrelease.yml

@@ -0,0 +1,47 @@
+name: patchrelease
+
+on:
+  push:
+    branches:
+      - patchrelease
+
+jobs:
+  build-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Read .nvmrc
+        run: echo "NODE_VERSION=$(cat .nvmrc)" >> $GITHUB_OUTPUT
+        id: nvmrc
+
+      - name: setup node ${{ steps.nvmrc.outputs.NODE_VERSION }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: '${{ steps.nvmrc.outputs.NODE_VERSION }}'
+          registry-url: 'https://registry.npmjs.org'
+
+      - name: install dependencies
+        run: yarn
+
+      - name: build design tokens package
+        run: yarn build
+        working-directory: ./packages/design-tokens
+
+      - name: build core package
+        run: yarn build
+        working-directory: ./packages/core
+
+      - name: build react package
+        run: yarn build
+        working-directory: ./packages/react
+
+      - name: build hds-js package
+        run: yarn build:hds-js
+        working-directory: ./packages/react
+
+      - name: release npm packages
+        run: yarn release --dist-tag patch
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/build-icon-library.yml → .github/workflows/update-icon-library.yml

@@ -1,8 +1,11 @@
-# Build icon library, create zip file for release and create PR
-name: icon library
+# Build icon library, create zip file for release and commit to current branch
+name: update icon library
 
 on:
   workflow_dispatch:
+  push:
+    branches:
+      - release-*
 
 jobs:
   build-icon-library:
@@ -17,6 +20,26 @@ jobs:
           node-version: '20.3.1'
           registry-url: 'https://registry.npmjs.org'
 
+      # Don't do anything if we're on development, main or master branches
+      - name: Check branch
+        run: |
+          if [[ $GITHUB_REF == refs/heads/development || $GITHUB_REF == refs/heads/master || $GITHUB_REF == refs/heads/main ]]; then
+            echo "Development, master pr main branch, skipping icon library build"
+            exit 1
+          fi
+
+      # Don't do anything if we're on release-x.x.x AND the icon-kit has the same version number (already built for the release)
+      # Skip this step if workflow was triggered by workflow_dispatch
+      - name: Check if icon library has already been built for this release
+        if: github.event_name != 'workflow_dispatch'
+        run: |
+          PKG_VER=`node -pe "require('./packages/react/package.json').version"`
+          ICON_KIT_VER=`sed -n -E 's/.*version[[:space:]]+([0-9]+([.][0-9]+)*).*/\1/p' ./release/icon-kit-template-CHANGELOG.txt`
+          if [[ ${PKG_VER} == ${ICON_KIT_VER} ]]; then
+            echo "Icon library has already been built for this release, skipping"
+            exit 0
+          fi
+
       - name: Run Glypfig
         run: |
           npx glypfig \
@@ -83,9 +106,4 @@ jobs:
           git config --global user.name "Github Actions"
           git add .
           git commit -m 'Updated icon library'
-          git push
-
-      - name: create pull request
-        run: gh pr create -B development --title 'Icon library build' --body 'Created by Github action icon library'
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          git push

CHANGELOG.md

@@ -5,6 +5,53 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.6.0] - March, 6, 2024
+
+### React
+
+#### Changed
+
+- [Tag] Marked changed and removed properties in the next major release
+
+#### Fixed
+
+- Warnings about "unmet peer dependency".
+- Removed old & deprecated individual `lodash` dependencies and replaced with the full package and importing the needed functions only.
+- [HeaderActionBarItemWithDropdown] Removed useless `@layer` css style which caused Jest/jsdom tests output errors.
+- [Checkbox] Layout issue when using external label with htmlLabelFor-attribute
+- [Table] Append className prop instead of overriding the existing classes
+
+### Core
+
+#### Fixed
+
+- [Icons] Document-group icon wrong colors
+- [Button] Some iOS-versions rendering rounded link buttons wrongly
+
+### Documentation
+
+#### Added
+
+- [Icons] Added missing icons to site icons list
+- Added links to React and Core Storybooks to Resources and Components pages
+
+#### Fixed
+
+- [Button] Fix wrong label on secondary Button variant example.
+- [Notification] Fix Core showing and hiding Toast Notification example
+
+### Figma
+
+#### Fixed
+
+- [Icons] Fixed document-group icon, removed stroke from the vector. Removed few export settings and fixed box’s black color to use HDS-token.
+
+### Icon kit
+
+#### Fixed:
+
+- [Forms and information] Fixed document-group icon svg, removed stroke from the vector.
+
 ## [3.5.0] - February, 6, 2024
 
 ### React
@@ -62,6 +109,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Icon kit
 
 #### Added:
+
 - [Icons] New icons in the Forms category: document-group, document-blank, document-blank-group, folder, folder-group & box
 
 ## [3.4.0] - January, 16, 2024
@@ -487,6 +535,14 @@ There is a brand new Figma library available. The licenses are checked and provi
 
 - [Header] Add HDS Header.sketch file to shared libraries for HDS 3.0.0 Alpha release purposes. The shared library file includes new Header and Side navigation symbols.
 
+## [2.17.1] - Feb, 7, 2024
+
+### React
+
+#### Fixed
+
+- Removed old & deprecated individual `lodash` dependencies and replaced with the full package and importing the needed functions only.
+
 ## [2.17.0] - Aug, 18, 2023
 
 ### React

package.json

@@ -7,17 +7,18 @@
     "site"
   ],
   "scripts": {
-    "build": "yarn build:tokens && yarn build:core && yarn build:react && yarn build:hds-js && yarn build:site",
+    "build": "yarn build:code && yarn build:site",
     "build:tokens": "lerna run --scope hds-design-tokens build",
     "build:core": "lerna run --scope hds-core build",
     "build:react": "lerna run --scope hds-react build",
-    "build:hds-js": "lerna run --scope hds-react build:hds-js",
     "build:site": "lerna run --scope site build",
+    "build:code": "yarn build:tokens && yarn build:core && yarn build:react",
     "clean": "lerna clean --yes && rimraf node_modules/ packages/core/lib packages/core/storybook-static packages/react/lib packages/react/storybook-static packages/design-tokens/lib site/.cache site/public",
     "start:core": "lerna run --scope hds-core start",
     "start:react": "lerna run --scope hds-react start",
     "release": "lerna publish from-package --yes",
-    "update-versions": "lerna version --exact --no-git-tag-version --no-push --amend --yes"
+    "update-versions": "lerna version --exact --no-git-tag-version --no-push --amend --yes",
+    "update-changelog": "node ./scripts/changelog/update-changelog.js"
   },
   "devDependencies": {
     "lerna": "^7.0.1",
@@ -29,8 +30,9 @@
     "@types/react-dom/@types/react": "17.0.2",
     "@types/react-dom/**/@types/react": "17.0.2",
     "**/@types/react-dom/**/@types/react": "17.0.2",
-    "multer": "1.4.4-lts.1",
+    "multer": "1.4.5-lts.1",
     "jpeg-js": "0.4.4",
-    "json5": "2.2.2"
+    "json5@>=2.0.0": "2.2.3",
+    "json5@>=1.0.0": "1.0.2"
   }
 }

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-core",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "Core styles for the Helsinki Design System",
   "homepage": "https://github.com/City-of-Helsinki/helsinki-design-system#readme",
   "license": "MIT",
@@ -30,7 +30,7 @@
     "@storybook/manager-webpack5": "^6.5.16",
     "copyfiles": "2.2.0",
     "cssnano": "4.1.10",
-    "hds-design-tokens": "3.5.0",
+    "hds-design-tokens": "3.6.0",
     "postcss": "8.2.15",
     "postcss-cli": "8.3.1",
     "postcss-import": "12.0.1",

packages/core/src/components/button/button.css

@@ -12,7 +12,6 @@
   * Normalize.css rules
   * Correct the inability to style clickable types in iOS and Safari.
   */
-  -webkit-appearance: button;
   background-color: var(--background-color, transparent);
   border: var(--border-width) solid var(--border-color, transparent);
   border-radius: 0;
@@ -63,6 +62,7 @@
  * Normalize.css rules
  * Correct the inability to style clickable types in iOS and Safari.
  */
+button.hds-button,
 .hds-button[type="button"],
 .hds-button[type="reset"],
 .hds-button[type="submit"] {

packages/core/src/components/checkbox/checkbox.css

@@ -136,7 +136,7 @@
 }
 
 .hds-checkbox .hds-checkbox__label--hidden {
-  padding-left: 0;
+  padding-left: var(--size);
 }
 
 /* ERROR */

packages/design-tokens/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-design-tokens",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "Design tokens for the Helsinki Design System",
   "homepage": "https://github.com/City-of-Helsinki/helsinki-design-system#readme",
   "license": "MIT",

packages/hds-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-js",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "Vanilla js for the Helsinki Design System",
   "homepage": "https://github.com/City-of-Helsinki/helsinki-design-system#readme",
   "license": "MIT",
@@ -13,9 +13,7 @@
     "cookie": "^0.4.1",
     "http-status-typed": "^1.0.1",
     "jwt-decode": "^3.1.2",
-    "lodash.isobject": "3.0.2",
-    "lodash.isundefined": "3.0.1",
-    "lodash.pick": "^4.4.0",
+    "lodash": "^4.17.21",
     "oidc-client-ts": "^2.2.2"
   },
   "scripts": {

packages/react/.eslintrc.json

@@ -10,11 +10,9 @@
     "plugin:import/typescript",
     "plugin:jest/recommended",
     "airbnb",
-    "prettier/@typescript-eslint",
-    "prettier/react",
     "plugin:prettier/recommended" // this should always be the last item on this array
   ],
-  "plugins": ["@typescript-eslint", "prettier", "jest", "import"],
+  "plugins": ["@typescript-eslint", "prettier", "react", "jest", "import"],
   "parserOptions": {
     "ecmaVersion": 2018,
     "ecmaFeatures": {
@@ -24,6 +22,7 @@
   "ignorePatterns": ["*.module.css"],
   "rules": {
     "no-use-before-define": "off",
+    "default-param-last": "off",
     "@typescript-eslint/no-use-before-define": ["error"],
     "no-shadow": "off", // replaced by ts-eslint rule below
     "@typescript-eslint/no-shadow": "error",
@@ -40,6 +39,7 @@
         "newlines-between": "always"
       }
     ],
+    "react/function-component-definition": "off",
     "react/jsx-filename-extension": "off",
     "react/jsx-one-expression-per-line": "off",
     "react/jsx-props-no-spreading": "off",
@@ -53,7 +53,12 @@
     "react/prop-types": "off",
     "import/extensions": "off",
     "import/prefer-default-export": "off",
-    "jsx-a11y/control-has-associated-label": "warn",
+    "jsx-a11y/control-has-associated-label": [
+      1,
+      {
+        "ignoreElements": ["td"]
+      }
+    ],
     "jsx-a11y/no-interactive-element-to-noninteractive-role": "warn",
     "jsx-a11y/label-has-associated-control": [
       2,