0.142.0 (#253)

* Update deps, fix typescript errors
* Update workflows to node 16 and v3 github actions

.github/workflows/deploy-storybook.yml

@@ -10,10 +10,10 @@ jobs:
   storybook:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
 
       - name: Read branch name
         id: vars

.github/workflows/publish-package.yml

@@ -12,7 +12,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
           # Setup .npmrc file to publish to npm
           registry-url: 'https://registry.npmjs.org'
       - run: yarn --frozen-lockfile

.github/workflows/publish-prerelease.yml

@@ -19,7 +19,7 @@ jobs:
           git config user.email github-actions@github.com
       - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
           # Setup .npmrc file to publish to npm
           registry-url: 'https://registry.npmjs.org'
       - run: yarn --frozen-lockfile

.github/workflows/pull-request.yml

@@ -10,54 +10,54 @@ jobs:
   typecheck:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
 
       - run: yarn --frozen-lockfile
       - run: yarn typecheck
 
   lint:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
 
       - run: yarn --frozen-lockfile
       - run: yarn lint
 
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
 
       - run: yarn --frozen-lockfile
       - run: yarn build
 
   storybook:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 14
+          node-version: 16
 
       - run: yarn --frozen-lockfile
       - run: yarn build-storybook
 
   jest: 
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: '14'
+          node-version: '16'
           cache: 'yarn'
 
       - run: yarn --frozen-lockfile

examples/nextjs/package.json

@@ -8,7 +8,7 @@
     "start": "next start"
   },
   "dependencies": {
-    "@vimeo/iris": "^0.141.0",
+    "@vimeo/iris": "^0.142.0",
     "next": "12.0.3",
     "polished": "^4.1.3",
     "react": "17.0.2",

package.json

@@ -2,7 +2,7 @@
     "name": "@vimeo/iris",
     "homepage": "https://github.com/vimeo/iris/tree/main",
     "bugs": "https://github.com/vimeo/iris/issues",
-    "version": "0.141.0",
+    "version": "0.142.0",
     "private": false,
     "license": "MIT",
     "description": "Vimeo Design System",
@@ -18,14 +18,14 @@
       "@babel/runtime": "^7.21.0"
      },
     "devDependencies": {
-        "@babel/core": "^7.21.3",
+        "@babel/core": "^7.21.4",
         "@babel/plugin-proposal-class-properties": "^7.18.6",
         "@babel/plugin-proposal-private-methods": "^7.18.6",
         "@babel/plugin-proposal-private-property-in-object": "^7.21.0",
-        "@babel/plugin-transform-runtime": "^7.21.0",
-        "@babel/preset-env": "^7.20.2",
+        "@babel/plugin-transform-runtime": "^7.21.4",
+        "@babel/preset-env": "^7.21.4",
         "@babel/preset-react": "^7.18.6",
-        "@babel/preset-typescript": "^7.21.0",
+        "@babel/preset-typescript": "^7.21.4",
         "@nox/addon-themes": "^1.1.3",
         "@rollup/plugin-babel": "^5.3.1",
         "@rollup/plugin-commonjs": "^21.1.0",
@@ -44,21 +44,21 @@
         "@testing-library/react": "12.1.5",
         "@testing-library/user-event": "^14.4.3",
         "@types/jest": "^28.1.8",
-        "@types/react": "^17.0.53",
+        "@types/react": "^17.0.56",
         "@types/react-dom": "^17.0.19",
         "@types/styled-components": "^5.1.26",
-        "@types/webpack": "^5.28.0",
-        "@typescript-eslint/eslint-plugin": "^5.55.0",
-        "@typescript-eslint/parser": "^5.55.0",
+        "@types/webpack": "^5.28.1",
+        "@typescript-eslint/eslint-plugin": "^5.57.1",
+        "@typescript-eslint/parser": "^5.57.1",
         "babel-jest": "^28.1.3",
         "babel-loader": "^8.3.0",
         "babel-plugin-polished": "^1.1.0",
         "babel-plugin-require-context-hook": "^1.0.0",
         "babel-plugin-styled-components": "^2.0.7",
         "circular-dependency-plugin": "^5.2.2",
-        "core-js": "^3.29.1",
-        "eslint": "^8.36.0",
-        "eslint-config-prettier": "^8.7.0",
+        "core-js": "^3.30.0",
+        "eslint": "^8.37.0",
+        "eslint-config-prettier": "^8.8.0",
         "eslint-config-react": "^1.1.7",
         "eslint-formatter-codeframe": "^7.32.1",
         "eslint-plugin-immutable": "^1.0.0",
@@ -72,12 +72,12 @@
         "jest-environment-jsdom": "^28.1.3",
         "polished": "^4.2.2",
         "pre-commit": "^1.2.2",
-        "prettier": "^2.8.4",
+        "prettier": "^2.8.7",
         "react": "*",
         "react-dom": "*",
         "react-is": "^17.0.2",
         "rollup": "^2.79.1",
-        "rollup-plugin-multi-input": "^1.3.3",
+        "rollup-plugin-multi-input": "^1.4.1",
         "rollup-plugin-terser": "^7.0.2",
         "styled-components": "^5.3.9",
         "stylelint": "^13.13.1",
@@ -87,7 +87,7 @@
         "tslib": "^2.5.0",
         "typescript": "4.9.5",
         "typescript-plugin-styled-components": "^2.0.0",
-        "webpack": "^5.76.2"
+        "webpack": "^5.78.0"
     },
     "peerDependencies": {
         "polished": "^4.2.2",
@@ -96,7 +96,7 @@
         "styled-components": "^5.3.6"
     },
     "resolutions": {
-        "@types/react": "^17.0.53",
+        "@types/react": "^17.0.56",
         "react-dom": "*",
         "react": "*"
     },

src/components/inputs/Input/Input.style.ts

@@ -1,4 +1,4 @@
-import styled, { css } from 'styled-components';
+import styled, { css, StyledComponent } from 'styled-components';
 import { rgba } from 'polished';
 
 import {
@@ -43,7 +43,10 @@ export const Faux = styled.div<any>`
   ${FauxType};
 `;
 
-export const HiddenMark = styled.input.attrs(({ type }) => ({
+export const HiddenMark: StyledComponent<
+  'input',
+  IrisInputProps
+> = styled.input.attrs(({ type }) => ({
   type: type === 'toggle' ? 'checkbox' : type,
   toggle: type === 'toggle',
 }))`

src/utils/HOCs/withIris.ts

@@ -9,7 +9,7 @@ import {
 } from 'react';
 import { ThemeContext } from 'styled-components';
 
-const version = '0.141.0';
+const version = '0.142.0';
 
 type IrisMeta =
   | true

src/utils/hooks/usePortal.ts

@@ -1,6 +1,9 @@
+import { ReactNode, ReactPortal } from 'react';
 import { createPortal } from 'react-dom';
 
-export function usePortal(children = null) {
+export function usePortal(
+  children: ReactNode = null
+): HTMLElement | ReactPortal {
   let outlet = document.getElementById('iris-portals');
 
   if (!outlet) {