Refactor ToggleButton and ToggleGroup

.eslintrc.js

@@ -1,17 +1,19 @@
 module.exports = {
   extends: [
     '@terrestris/eslint-config-typescript',
+    '@terrestris/eslint-config-typescript-react',
     'plugin:testing-library/react',
     'plugin:jest-dom/recommended'
   ],
   plugins: [
     'testing-library',
-    'jest-dom'
+    'jest-dom',
+    'simple-import-sort'
   ],
   rules: {
-    'no-underscore-dangle': 'off',
     '@typescript-eslint/member-ordering': 'off',
-    'testing-library/no-node-access': 'warn',
-    'testing-library/no-container': 'warn'
+    'no-underscore-dangle': 'off',
+    'simple-import-sort/exports': 'warn',
+    'simple-import-sort/imports': 'warn'
   }
 };

.eslintrc.styleguide.js

@@ -6,10 +6,14 @@ module.exports = {
     'markdown'
   ],
   overrides: [{
-    files: ["**/*.{md,mkdn,mdown,markdown}"],
-    processor: "markdown/markdown"
+    files: [
+      '**/*.{md,mkdn,mdown,markdown}'
+    ],
+    processor: 'markdown/markdown'
   }, {
-    files: ["**/*.{md,mkdn,mdown,markdown}/*.{js,javascript,jsx,node}"]
+    files: [
+      '**/*.{md,mkdn,mdown,markdown}/*.{js,javascript,jsx,node}'
+    ]
   }],
   env: {
     browser: true

.github/workflows/on-publish.yml

@@ -14,10 +14,10 @@ jobs:
       with:
         persist-credentials: false
 
-    - name: Setup Node.js 16 👷🏻
+    - name: Setup Node.js 18 👷🏻
       uses: actions/setup-node@v1
       with:
-        node-version: 16
+        node-version: 18
 
     - name: Cache Node.js modules 💾
       uses: actions/cache@v2
@@ -29,7 +29,7 @@ jobs:
           ${{ runner.OS }}-
 
     - name: Install dependencies ⏬
-      run: npm ci
+      run: npm ci --force
 
     - name: Build styleguide 🏗️
       run: npm run build:styleguide

.github/workflows/on-pull-request.yml

@@ -9,10 +9,10 @@ jobs:
     - name: Checkout sources 🔰
       uses: actions/checkout@v2
 
-    - name: Setup Node.js 16
+    - name: Setup Node.js 18
       uses: actions/setup-node@v1
       with:
-        node-version: 16
+        node-version: 18
 
     - name: Cache Node.js modules 💾
       uses: actions/cache@v2
@@ -24,7 +24,7 @@ jobs:
           ${{ runner.OS }}-
 
     - name: Install dependencies ⏬
-      run: npm ci
+      run: npm ci --force
 
     - name: Build artifacts 🏗️
       run: npm run build

.github/workflows/on-push-main.yml

@@ -12,10 +12,10 @@ jobs:
     - name: Checkout sources 🔰
       uses: actions/checkout@v2
 
-    - name: Setup Node.js 16 👷🏻
+    - name: Setup Node.js 18 👷🏻
       uses: actions/setup-node@v1
       with:
-        node-version: 16
+        node-version: 18
 
     - name: Cache Node.js modules 💾
       uses: actions/cache@v2
@@ -27,7 +27,7 @@ jobs:
           ${{ runner.OS }}-
 
     - name: Install dependencies ⏬
-      run: npm ci
+      run: npm ci --force
 
     - name: Generate coverage 🧪
       run: npm test

.github/workflows/release.yaml

@@ -15,13 +15,13 @@ jobs:
       - name: Checkout sources 🔰
         uses: actions/checkout@v2
 
-      - name: Setup Node.js 16 👷🏻
+      - name: Setup Node.js 18 👷🏻
         uses: actions/setup-node@v1
         with:
-          node-version: 16
+          node-version: 18
 
       - name: Install dependencies ⏬
-        run: npm ci
+        run: npm ci --force
 
       - name: Build artifacts 🏗️
         run: npm run build

.gitignore

@@ -22,3 +22,4 @@ node_modules
 
 # ignore IntelliJ iml files
 *.iml
+.idea

.nvmrc

@@ -0,0 +1 @@
+v18

babel.config.js

@@ -13,6 +13,6 @@ module.exports = {
   },
   plugins: [
     '@babel/plugin-syntax-dynamic-import',
-    '@babel/plugin-proposal-class-properties'
+    '@babel/plugin-transform-class-properties'
   ]
 };

jest.config.js

@@ -20,7 +20,7 @@ module.exports = {
     '<rootDir>/dist/'
   ],
   transformIgnorePatterns: [
-    'node_modules/(?!(ol|antd|@camptocamp/inkmap|(rc-[a-z-]*)|@ant-design\/css-animation|(-[a-z]+)*|@babel\/runtime)/)'
+    'node_modules/(?!(ol|@camptocamp/inkmap|@terrestris/react-util|d3-selection)/)'
   ],
   setupFiles: [
     '<rootDir>/jest/__mocks__/matchMediaMock.js'

jest/setup.js

@@ -1,8 +1,34 @@
 import Enzyme from 'enzyme';
-import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
+import Adapter from '@cfaester/enzyme-adapter-react-18';
 import 'whatwg-fetch';
 import 'jest-canvas-mock';
 import '@testing-library/jest-dom';
 import 'regenerator-runtime/runtime';
+import {
+  TextEncoder,
+  TextDecoder
+} from 'util';
+
+Object.assign(global, {
+  TextDecoder,
+  TextEncoder
+});
 
 Enzyme.configure({ adapter: new Adapter() });
+
+jest.mock('use-resize-observer', () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    observe: jest.fn(),
+    unobserve: jest.fn(),
+    disconnect: jest.fn(),
+  })),
+}));
+
+window.ResizeObserver =
+    window.ResizeObserver ||
+    jest.fn().mockImplementation(() => ({
+      disconnect: jest.fn(),
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+    }));