diff --git a/libraries/core-react/src/Chip/Chip.tsx b/libraries/core-react/src/Chip/Chip.tsx index c908468636..ff9c9f7129 100644 --- a/libraries/core-react/src/Chip/Chip.tsx +++ b/libraries/core-react/src/Chip/Chip.tsx @@ -170,24 +170,34 @@ export const Chip = forwardRef(function Chip( variant, } - const handleKeyPress = (event) => { - const { key } = event + const handleKeyPress = ( + event: + | React.KeyboardEvent + | React.MouseEvent, + ) => { + const { key } = event as React.KeyboardEvent if (key === 'Enter') { if (deletable) { handleDelete(event) } // Delete takes precedence, else click action is activated if (clickable && !deletable) { - handleClick(event) + handleClick(event as React.MouseEvent) } } } + type childPropsType = { + size: number + disabled: boolean + } + const resizedChildren = React.Children.map( children, (child: React.ReactElement) => { // We force size on Icon & Avatar component - if (child.props && child.props.size) { + const childProps = child.props as childPropsType + if (child.props && childProps.size) { return React.cloneElement(child, { size: 16, disabled, @@ -197,7 +207,9 @@ export const Chip = forwardRef(function Chip( }, ) - const onDeleteClick = (event) => { + const onDeleteClick = ( + event: React.MouseEvent, + ) => { event.stopPropagation() if (deletable) { handleDelete(event) diff --git a/libraries/core-react/src/Divider/Divider.tokens.ts b/libraries/core-react/src/Divider/Divider.tokens.ts index 4fbcfd5c25..304472bfc5 100644 --- a/libraries/core-react/src/Divider/Divider.tokens.ts +++ b/libraries/core-react/src/Divider/Divider.tokens.ts @@ -15,12 +15,12 @@ const { const dividerHeight = 1 -const reduceByValue = (subtractValue) => (valueWithUnit) => { +const reduceByValue = (subtractValue: number) => (valueWithUnit: string) => { const valueAndUnit = valueWithUnit .split(/(\d+)/) .filter((val) => val.length > 0) - return valueAndUnit[0] - subtractValue + valueAndUnit[1] + return `${parseInt(valueAndUnit[0]) - subtractValue}` + valueAndUnit[1] } const reduceValueByDividerHeight = reduceByValue(dividerHeight) diff --git a/libraries/core-react/src/Search/Search.test.tsx b/libraries/core-react/src/Search/Search.test.tsx index b3400e0f7f..c5ee0c766a 100644 --- a/libraries/core-react/src/Search/Search.test.tsx +++ b/libraries/core-react/src/Search/Search.test.tsx @@ -1,4 +1,3 @@ -/* eslint-disable no-undef */ import React from 'react' import { render, cleanup, fireEvent, screen } from '@testing-library/react' import '@testing-library/jest-dom' @@ -34,8 +33,8 @@ describe('Search', () => { let callbackId = '' let callbackValue = '' const handleOnChange = jest.fn(({ target: { id, value } }) => { - callbackId = id - callbackValue = value + callbackId = id as string + callbackValue = value as string }) render( @@ -57,8 +56,8 @@ describe('Search', () => { let callbackId = '' let callbackValue = '' const handleOnChange = jest.fn(({ target: { id, value } }) => { - callbackValue = value - callbackId = id + callbackValue = value as string + callbackId = id as string }) render( @@ -83,7 +82,7 @@ describe('Search', () => { const searchId = 'search-id-when-testing' let callbackId = '' const handleOnFocus = jest.fn(({ target: { id } }) => { - callbackId = id + callbackId = id as string }) render() @@ -98,7 +97,7 @@ describe('Search', () => { const searchId = 'search-id-when-testing' let callbackId = '' const handleOnBlur = jest.fn(({ target: { id } }) => { - callbackId = id + callbackId = id as string }) render() diff --git a/libraries/core-react/src/Search/Search.tsx b/libraries/core-react/src/Search/Search.tsx index 9aa98b342a..e224a5c7ad 100644 --- a/libraries/core-react/src/Search/Search.tsx +++ b/libraries/core-react/src/Search/Search.tsx @@ -209,12 +209,18 @@ export const Search = React.forwardRef( setState({ ...state, isActive }) }, [value, defaultValue]) - const handleOnClick = () => inputRef.current.focus() + const handleOnClick = () => { + const inputEl = inputRef.current as HTMLInputElement + inputEl.focus() + } const handleFocus = () => setState({ ...state, isFocused: true }) const handleBlur = () => setState({ ...state, isFocused: false }) - const handleOnChange = (target) => setIsActive(target.value) + const handleOnChange = (event: React.ChangeEvent) => { + setIsActive((event.target as HTMLInputElement).value) + } + const handleOnDelete = () => { - const input = inputRef.current + const input = inputRef.current as HTMLInputElement const clearedValue = '' setReactInputValue(input, clearedValue) setState({ ...state, isActive: false }) @@ -223,7 +229,6 @@ export const Search = React.forwardRef( setState({ ...state, isActive: newValue !== '' }) /** Applying props for controlled vs. uncontrolled scnarios */ - // eslint-disable-next-line no-shadow const applyControllingProps: ControlledSearch = ( props, value, diff --git a/libraries/core-react/src/SelectionControls/Checkbox/Checkbox.tokens.ts b/libraries/core-react/src/SelectionControls/Checkbox/Checkbox.tokens.ts index 7e0446a006..c9f2e9a49b 100644 --- a/libraries/core-react/src/SelectionControls/Checkbox/Checkbox.tokens.ts +++ b/libraries/core-react/src/SelectionControls/Checkbox/Checkbox.tokens.ts @@ -1,4 +1,3 @@ -// @ts-nocheck import { tokens } from '@equinor/eds-tokens' const { diff --git a/libraries/core-react/src/Tabs/TabList.tsx b/libraries/core-react/src/Tabs/TabList.tsx index 53dd51e44e..e905c4f975 100644 --- a/libraries/core-react/src/Tabs/TabList.tsx +++ b/libraries/core-react/src/Tabs/TabList.tsx @@ -39,7 +39,11 @@ type TabListProps = { variant?: Variants } & HTMLAttributes -type TabChild = JSX.IntrinsicElements['button'] & ReactElement +type TabChild = { + disabled?: boolean + index?: number +} & JSX.IntrinsicElements['button'] & + ReactElement const TabList = forwardRef(function TabsList( { children = [], ...props }, @@ -68,26 +72,32 @@ const TabList = forwardRef(function TabsList( currentTab.current = activeTab }, [activeTab]) - const Tabs = React.Children.map(children, (child: TabChild, index) => { - const tabRef = - index === activeTab - ? useCombinedRefs(child.ref, selectedTabRef) - : child.ref - - return React.cloneElement(child, { - id: `${tabsId}-tab-${index + 1}`, - 'aria-controls': `${tabsId}-panel-${index + 1}`, - active: index === activeTab, - index, - onClick: () => handleChange(index), - ref: tabRef, - }) - }) + const Tabs = React.Children.map( + children, + (child: TabChild, index: number) => { + const tabRef = + index === activeTab + ? useCombinedRefs(child.ref, selectedTabRef) + : child.ref + + return React.cloneElement(child, { + id: `${tabsId}-tab-${index + 1}`, + 'aria-controls': `${tabsId}-panel-${index + 1}`, + active: index === activeTab, + index, + onClick: () => handleChange(index), + ref: tabRef, + }) + }, + ) - // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment - const focusableChildren: number[] = Tabs.filter( - (child) => !child.props.disabled, - ).map((child) => child.props.index) + const focusableChildren: number[] = Tabs.filter((child: TabChild) => { + const childProps = child.props as TabChild + return !childProps.disabled + }).map((child: TabChild) => { + const childProps = child.props as TabChild + return childProps.index + }) const firstFocusableChild = focusableChildren[0] const lastFocusableChild = focusableChildren[focusableChildren.length - 1] diff --git a/libraries/core-react/src/Typography/Typography.tsx b/libraries/core-react/src/Typography/Typography.tsx index 6a4320e49d..8595f204c1 100644 --- a/libraries/core-react/src/Typography/Typography.tsx +++ b/libraries/core-react/src/Typography/Typography.tsx @@ -53,7 +53,9 @@ const findTypography = ( const findColor: (a: ColorVariants | string) => string = ( inputColor = null, ): string => - typeof colors[inputColor] === 'undefined' ? inputColor : colors[inputColor] + typeof colors[inputColor] === 'undefined' + ? inputColor + : (colors[inputColor] as string) const toVariantName = ( variant: TypographyVariants, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 816e352706..54f881e8bc 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,14 +11,8 @@ devDependencies: eslint-plugin-testing-library: 1.5.0_eslint@7.11.0 prettier: 2.0.5 typescript: 4.0.2 -lockfileVersion: 5.2 +lockfileVersion: 5.1 packages: - /@babel/code-frame/7.10.1: - dependencies: - '@babel/highlight': 7.10.1 - dev: true - resolution: - integrity: sha512-IGhtTmpjGbYzcEDOw7DcQtbQSXcG9ftmAXtWTu9V936vDye4xjjekktFAtgZsWpzTj/X01jocB46mTywm/4SZw== /@babel/code-frame/7.10.4: dependencies: '@babel/highlight': 7.10.4 @@ -29,7 +23,7 @@ packages: dependencies: '@babel/types': 7.10.2 jsesc: 2.5.2 - lodash: 4.17.15 + lodash: 4.17.20 source-map: 0.5.7 dev: true resolution: @@ -54,22 +48,10 @@ packages: dev: true resolution: integrity: sha512-UQ1LVBPrYdbchNhLwj6fetj46BcFwfS4NllJo/1aJsT+1dLTEnXJL0qHqtY7gPzF8S2fXBJamf1biAXV3X077g== - /@babel/helper-validator-identifier/7.10.1: - dev: true - resolution: - integrity: sha512-5vW/JXLALhczRCWP0PnFDMCJAchlBvM7f4uk/jXritBnIa6E1KmqmtrS3yn1LAnxFBypQ3eneLuXjsnfQsgILw== /@babel/helper-validator-identifier/7.10.4: dev: true resolution: integrity: sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw== - /@babel/highlight/7.10.1: - dependencies: - '@babel/helper-validator-identifier': 7.10.1 - chalk: 2.4.2 - js-tokens: 4.0.0 - dev: true - resolution: - integrity: sha512-8rMof+gVP8mxYZApLF/JgNDAkdKa+aJt3ZYxF8z6+j/hpeXL7iMsKCPHa2jNMHu/qqBwzQF4OHNoYi8dMA/rYg== /@babel/highlight/7.10.4: dependencies: '@babel/helper-validator-identifier': 7.10.4 @@ -100,7 +82,7 @@ packages: integrity: sha512-6sF3uQw2ivImfVIl62RZ7MXhO2tap69WeWK57vAaimT6AZbE4FbqjdEJIN1UqoD6wI6B+1n9UiagafH1sxjOtg== /@babel/template/7.10.1: dependencies: - '@babel/code-frame': 7.10.1 + '@babel/code-frame': 7.10.4 '@babel/parser': 7.10.2 '@babel/types': 7.10.2 dev: true @@ -108,22 +90,22 @@ packages: integrity: sha512-OQDg6SqvFSsc9A0ej6SKINWrpJiNonRIniYondK2ViKhB06i3c0s+76XUft71iqBEe9S1OKsHwPAjfHnuvnCig== /@babel/traverse/7.10.1: dependencies: - '@babel/code-frame': 7.10.1 + '@babel/code-frame': 7.10.4 '@babel/generator': 7.10.2 '@babel/helper-function-name': 7.10.1 '@babel/helper-split-export-declaration': 7.10.1 '@babel/parser': 7.10.2 '@babel/types': 7.10.2 - debug: 4.1.1 + debug: 4.2.0 globals: 11.12.0 - lodash: 4.17.15 + lodash: 4.17.20 dev: true resolution: integrity: sha512-C/cTuXeKt85K+p08jN6vMDz8vSV0vZcI0wmQ36o6mjbuo++kPMdpOYw23W2XH04dbRt9/nMEfA4W3eR21CD+TQ== /@babel/types/7.10.2: dependencies: - '@babel/helper-validator-identifier': 7.10.1 - lodash: 4.17.15 + '@babel/helper-validator-identifier': 7.10.4 + lodash: 4.17.20 to-fast-properties: 2.0.0 dev: true resolution: @@ -161,7 +143,7 @@ packages: dependencies: '@typescript-eslint/experimental-utils': 3.10.1_eslint@7.11.0+typescript@4.0.2 '@typescript-eslint/parser': 3.10.1_eslint@7.11.0+typescript@4.0.2 - debug: 4.1.1 + debug: 4.2.0 eslint: 7.11.0 functional-red-black-tree: 1.0.1 regexpp: 3.1.0 @@ -186,7 +168,7 @@ packages: '@typescript-eslint/types': 3.10.1 '@typescript-eslint/typescript-estree': 3.10.1_typescript@4.0.2 eslint: 7.11.0 - eslint-scope: 5.1.0 + eslint-scope: 5.1.1 eslint-utils: 2.1.0 dev: true engines: @@ -226,7 +208,7 @@ packages: dependencies: '@typescript-eslint/types': 3.10.1 '@typescript-eslint/visitor-keys': 3.10.1 - debug: 4.1.1 + debug: 4.2.0 glob: 7.1.6 is-glob: 4.0.1 lodash: 4.17.20 @@ -357,12 +339,12 @@ packages: integrity: sha512-ICt34ZmrVt8UQnvPl6TVyDTkmhXmAyAT4Jh5ugfGUX4MOrZ+U/ZY6/sdylRw3qGNr9Ub5AJsaHeDMzNLehRdOQ== /babel-eslint/10.1.0_eslint@7.11.0: dependencies: - '@babel/code-frame': 7.10.1 + '@babel/code-frame': 7.10.4 '@babel/parser': 7.10.2 '@babel/traverse': 7.10.1 '@babel/types': 7.10.2 eslint: 7.11.0 - eslint-visitor-keys: 1.2.0 + eslint-visitor-keys: 1.3.0 resolve: 1.17.0 dev: true engines: @@ -468,12 +450,6 @@ packages: dev: true resolution: integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== - /debug/4.1.1: - dependencies: - ms: 2.1.2 - dev: true - resolution: - integrity: sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw== /debug/4.2.0: dependencies: ms: 2.1.2 @@ -689,15 +665,6 @@ packages: eslint: '>=5' resolution: integrity: sha512-wSfVeCNseDQE+JltDkMbTBhinWwyeDE6aSH27Kbm907RT0YM0YPXjRpXdhAjSsR5T7NEXJDhpUTQE8nD+z/9Iw== - /eslint-scope/5.1.0: - dependencies: - esrecurse: 4.2.1 - estraverse: 4.3.0 - dev: true - engines: - node: '>=8.0.0' - resolution: - integrity: sha512-iiGRvtxWqgtx5m8EyQUJihBloE4EnYeGE/bz1wSPwJE6tZuJUtHlhqDM4Xj2ukE8Dyy1+HCZ4hE0fzIVMzb58w== /eslint-scope/5.1.1: dependencies: esrecurse: 4.3.0 @@ -715,12 +682,6 @@ packages: node: '>=6' resolution: integrity: sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg== - /eslint-visitor-keys/1.2.0: - dev: true - engines: - node: '>=4' - resolution: - integrity: sha512-WFb4ihckKil6hu3Dp798xdzSfddwKKU3+nGniKF6HfeW6OLd2OUDEPP7TcHtB5+QXOKg2s6B2DaMPE1Nn/kxKQ== /eslint-visitor-keys/1.3.0: dev: true engines: @@ -803,14 +764,6 @@ packages: node: '>=0.10' resolution: integrity: sha512-olpvt9QG0vniUBZspVRN6lwB7hOZoTRtT+jzR+tS4ffYx2mzbw+z0XCOk44aaLYKApNX5nMm+E+P6o25ip/DHQ== - /esrecurse/4.2.1: - dependencies: - estraverse: 4.3.0 - dev: true - engines: - node: '>=4.0' - resolution: - integrity: sha512-64RBB++fIOAXPw3P9cy89qfMlvZEXZkqqJkjqqXIvzP5ezRZjW+lPWjw35UX/3EhUPFYbg5ER4JYgDw4007/DQ== /esrecurse/4.3.0: dependencies: estraverse: 5.2.0 @@ -1148,10 +1101,6 @@ packages: node: '>=4' resolution: integrity: sha1-K1aLJl7slExtnA3pw9u7ygNUzY4= - /lodash/4.17.15: - dev: true - resolution: - integrity: sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A== /lodash/4.17.20: dev: true resolution: @@ -1757,7 +1706,7 @@ specifiers: '@typescript-eslint/eslint-plugin': ^3.10.1 '@typescript-eslint/parser': ^3.10.1 babel-eslint: ^10.1.0 - eslint: 7.11.0 + eslint: ^7.11.0 eslint-config-prettier: ^6.11.0 eslint-plugin-import: ^2.21.1 eslint-plugin-jsx-a11y: ^6.2.3