feat(controls): fix linting issues

Author: plouc

conf/rollup.config.mjs

@@ -36,7 +36,9 @@ const common = {
         || id.indexOf('d3') === 0
         || id.indexOf('@nivo') === 0
         || id.indexOf('lodash') === 0
-        || id.indexOf('@react-spring') === 0,
+        || id.indexOf('@react-spring') === 0
+        || id.indexOf('styled-components') === 0
+        || id.indexOf('dedent-js') === 0
 }
 
 const commonPlugins = [

packages/bar/src/BarCanvas.tsx

@@ -263,7 +263,7 @@ const InnerBarCanvas = <D extends BarDatum>({
         canvasEl.current.width = outerWidth * pixelRatio
         canvasEl.current.height = outerHeight * pixelRatio
 
-        const ctx = canvasEl.current?.getContext('2d')!
+        const ctx = canvasEl.current.getContext('2d')!
 
         ctx.scale(pixelRatio, pixelRatio)
 

packages/controls/README.md

@@ -1,18 +1,9 @@
 <a href="https://nivo.rocks"><img alt="nivo" src="https://raw.githubusercontent.com/plouc/nivo/master/nivo.png" width="216" height="68"/></a>
 
-# `@nivo/chord`
+# `@nivo/controls`
 
-[![version](https://img.shields.io/npm/v/@nivo/chord?style=for-the-badge)](https://www.npmjs.com/package/@nivo/chord)
-[![downloads](https://img.shields.io/npm/dm/@nivo/chord?style=for-the-badge)](https://www.npmjs.com/package/@nivo/chord)
+[![version](https://img.shields.io/npm/v/@nivo/controls?style=for-the-badge)](https://www.npmjs.com/package/@nivo/controls)
+[![downloads](https://img.shields.io/npm/dm/@nivo/controls?style=for-the-badge)](https://www.npmjs.com/package/@nivo/controls)
 
-## Chord
-
-[documentation](http://nivo.rocks/chord)
-
-![Chord](https://raw.githubusercontent.com/plouc/nivo/master/website/src/assets/captures/chord.png)
-
-## ChordCanvas
-
-[documentation](http://nivo.rocks/chord/canvas)
-
-![ChordCanvas](https://raw.githubusercontent.com/plouc/nivo/master/website/src/assets/captures/chord-canvas.png)
+This package is currently in development and is mostly for internal use for the nivo website.
+It contains a set of components that are used to create the controls for the nivo charts.

packages/controls/src/ControlGroup/ControlGroup.tsx

@@ -140,7 +140,7 @@ const ControlSwitcher = memo(
 
             default:
                 throw new Error(
-                    // @ts-expect-error
+                    // @ts-expect-error this could happen at runtime
                     `invalid control type: ${controlConfig!.type} for property: ${property.name}`
                 )
         }

packages/controls/src/ObjectControl/ObjectControl.tsx

@@ -24,7 +24,7 @@ export const ObjectControl = memo(({ property, context, value, onChange }: Objec
                 ...prop,
                 group,
             })),
-        [props]
+        [props, group]
     )
 
     const newContext = {

packages/controls/src/chrome/ControlHeader.tsx

@@ -24,7 +24,7 @@ const getDefaultValue = (value: any) => {
 
         return <span>[{elements}]</span>
     } else if (isString(value)) {
-        return <code className="code-string">'{value}'</code>
+        return <code className="code-string">&lsquo;{value}&rsquo;</code>
     } else if (isNumber(value)) {
         return <code className="code-number">{value}</code>
     } else if (isBoolean(value)) {

packages/controls/src/chrome/Switch.tsx

@@ -27,6 +27,7 @@ export const Switch = memo(({ id, value, onChange, colors = {} }: SwitchProps) =
                 onChange={handleChange}
                 colors={colors}
             />
+            {/* eslint-disable-next-line jsx-a11y/label-has-associated-control */}
             <label htmlFor={`${id}.switch`} />
         </Wrapper>
     )