From fd1c54cacdbd1798d806bd7ff91e60b3f0149420 Mon Sep 17 00:00:00 2001
From: mhatvan <markus_hatvan@aon.at>
Date: Sat, 24 Jul 2021 10:44:18 +0200
Subject: - updated classnames to 2.3.1 to use added type definitions - remove
 stub type definitions from package.json - set 'noImplicitAny' false until jss
 and react-jss packages are upgraded to use own type definitions - add missing
 csstype to package/forms and update code to v3

---
 packages/forms/src/button/index.tsx | 34 +++++++++++++---------------------
 1 file changed, 13 insertions(+), 21 deletions(-)

(limited to 'packages/forms/src/button/index.tsx')

diff --git a/packages/forms/src/button/index.tsx b/packages/forms/src/button/index.tsx
index b81154a43..8eba17415 100644
--- a/packages/forms/src/button/index.tsx
+++ b/packages/forms/src/button/index.tsx
@@ -1,7 +1,7 @@
 import Icon from '@mdi/react';
 import { Theme } from '@meetfranz/theme';
 import classnames from 'classnames';
-import CSS from 'csstype';
+import * as CSS from 'csstype';
 import React, { Component } from 'react';
 import injectStyle, { withTheme } from 'react-jss';
 import Loader from 'react-loader';
@@ -14,7 +14,7 @@ interface IProps extends IFormField, IWithStyle {
   className?: string;
   disabled?: boolean;
   id?: string;
-  type?: "button" | "reset" | "submit" | undefined;
+  type?: 'button' | 'reset' | 'submit' | undefined;
   onClick: (event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<HTMLAnchorElement>) => void;
   buttonType?: ButtonType;
   stretch?: boolean;
@@ -34,13 +34,13 @@ const styles = (theme: Theme) => ({
     borderRadius: theme.borderRadiusSmall,
     border: 'none',
     display: 'inline-flex',
-    position: 'relative' as CSS.PositionProperty,
+    position: 'relative' as CSS.Property.Position,
     transition: 'background .5s, opacity 0.3s',
-    textAlign: 'center' as CSS.TextAlignProperty,
+    textAlign: 'center' as CSS.Property.TextAlign,
     outline: 'none',
     alignItems: 'center',
     padding: 0,
-    width: (props: IProps) => (props.stretch ? '100%' : 'auto') as CSS.WidthProperty<string>,
+    width: (props: IProps) => (props.stretch ? '100%' : 'auto') as CSS.Property.Width<string>,
     fontSize: theme.uiFontSize,
     textDecoration: 'none',
     // height: theme.buttonHeight,
@@ -113,7 +113,7 @@ const styles = (theme: Theme) => ({
     opacity: theme.inputDisabledOpacity,
   },
   loader: {
-    position: 'relative' as CSS.PositionProperty,
+    position: 'relative' as CSS.Property.Position,
     width: 20,
     height: 18,
     zIndex: 9999,
@@ -123,9 +123,9 @@ const styles = (theme: Theme) => ({
     height: 20,
     overflow: 'hidden',
     transition: 'all 0.3s',
-    marginLeft: (props: IProps): number => !props.busy ? 10 : 20,
-    marginRight: (props: IProps): number => !props.busy ? -10 : -20,
-    position: (props: IProps): CSS.PositionProperty => props.stretch ? 'absolute' : 'inherit',
+    marginLeft: (props: IProps): number => (!props.busy ? 10 : 20),
+    marginRight: (props: IProps): number => (!props.busy ? -10 : -20),
+    position: (props: IProps): CSS.Property.Position => props.stretch ? 'absolute' : 'inherit',
   },
   icon: {
     margin: [1, 10, 0, -5],
@@ -155,7 +155,7 @@ class ButtonComponent extends Component<IProps> {
       if (this.props.busy) {
         setTimeout(() => {
           this.setState({ busy: nextProps.busy });
-        },         300);
+        }, 300);
       } else {
         this.setState({ busy: nextProps.busy });
       }
@@ -180,9 +180,7 @@ class ButtonComponent extends Component<IProps> {
       target,
     } = this.props;
 
-    const {
-      busy,
-    } = this.state;
+    const { busy } = this.state;
 
     let showLoader = false;
     if (loaded) {
@@ -207,19 +205,13 @@ class ButtonComponent extends Component<IProps> {
           )}
         </div>
         <div className={classes.label}>
-          {icon && (
-            <Icon
-              path={icon}
-              size={0.8}
-              className={classes.icon}
-            />
-          )}
+          {icon && <Icon path={icon} size={0.8} className={classes.icon} />}
           {label}
         </div>
       </>
     );
 
-    let wrapperComponent = null;
+    let wrapperComponent: JSX.Element;
 
     if (!href) {
       wrapperComponent = (
-- 
cgit v1.2.3-70-g09d2