Migration of more components

src/components/LayerEditorGroup.tsx

@@ -1,5 +1,4 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import Icon from '@mdi/react'
 import {
   mdiMenuDown,
@@ -13,21 +12,22 @@ import {
 } from 'react-accessible-accordion';
 
 
-export default class LayerEditorGroup extends React.Component {
+type LayerEditorGroupProps = {
-  static propTypes = {
+  "id"?: string
-    "id": PropTypes.string,
+  "data-wd-key"?: string
-    "data-wd-key": PropTypes.string,
+  title: string
-    title: PropTypes.string.isRequired,
+  isActive: boolean
-    isActive: PropTypes.bool.isRequired,
+  children: React.ReactElement
-    children: PropTypes.element.isRequired,
+  onActiveToggle(...args: unknown[]): unknown
-    onActiveToggle: PropTypes.func.isRequired
+};
-  }
 
+
+export default class LayerEditorGroup extends React.Component<LayerEditorGroupProps> {
   render() {
     return <AccordionItem uuid={this.props.id}>
       <AccordionItemHeading className="maputnik-layer-editor-group"
         data-wd-key={"layer-editor-group:"+this.props["data-wd-key"]}
-        onClick={e => this.props.onActiveToggle(!this.props.isActive)}
+        onClick={_e => this.props.onActiveToggle(!this.props.isActive)}
       >
         <AccordionItemButton className="maputnik-layer-editor-group__button">
           <span style={{flexGrow: 1}}>{this.props.title}</span>

src/components/LayerListGroup.tsx

@@ -1,21 +1,20 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import Collapser from './Collapser'
 
-export default class LayerListGroup extends React.Component {
+type LayerListGroupProps = {
-  static propTypes = {
+  title: string
-    title: PropTypes.string.isRequired,
+  "data-wd-key"?: string
-    "data-wd-key": PropTypes.string,
+  isActive: boolean
-    isActive: PropTypes.bool.isRequired,
+  onActiveToggle(...args: unknown[]): unknown
-    onActiveToggle: PropTypes.func.isRequired,
+  'aria-controls'?: string
-    'aria-controls': PropTypes.string,
+};
-  }
 
+export default class LayerListGroup extends React.Component<LayerListGroupProps> {
   render() {
     return <li className="maputnik-layer-list-group">
       <div className="maputnik-layer-list-group-header"
         data-wd-key={"layer-list-group:"+this.props["data-wd-key"]}
-        onClick={e => this.props.onActiveToggle(!this.props.isActive)}
+        onClick={_e => this.props.onActiveToggle(!this.props.isActive)}
       >
         <button
           className="maputnik-layer-list-group-title"