fix: remove tsc compiler warnings

Author: csvenke

README.md

@@ -25,7 +25,6 @@
   </p>
 
   <p>
-    <a href="#key-features">Key features</a> •
     <a href="#install">Install</a> •
     <a href="#example-usage">Example usage</a> •
     <a href="#why">Why?</a> •
@@ -38,13 +37,6 @@
 
 </div>
 
-## Key features
-
-* __Blazing fast!__
-* __Small bundle size!__
-* __Typescript definition files!__
-* __Above 90% test coverage!__
-
 ## Install
 
 ```bash

package-lock.json

@@ -7,12 +7,12 @@
     "type": "git",
     "url": "https://github.com/csvenke/react-semantics.git"
   },
-  "main": "index.js",
-  "module": "index.es.js",
+  "main": "index.cjs.js",
+  "module": "index.esm.js",
   "types": "types/index.d.ts",
   "files": [
-    "index.js",
-    "index.es.js",
+    "index.cjs.js",
+    "index.esm.js",
     "types/index.d.ts",
     "types/components"
   ],
@@ -22,7 +22,9 @@
     "react",
     "react-components",
     "react-utils",
-    "react-library"
+    "react-library",
+    "react-component-library",
+    "semantic"
   ],
   "dependencies": {
     "prop-types": "^15.6.2"
@@ -78,15 +80,16 @@
     "docs:server": "styleguidist server",
     "docs": "styleguidist build",
     "lint:fix": "npm run lint:write --fix \"src/**/*.{ts,tsx}\"",
-    "lint:write": "tslint -c tslint.json",
+    "lint:write": "tslint -p tsconfig.build.json -c tslint.json",
     "lint": "npm run lint:write  \"src/**/*.{ts,tsx}\"",
     "prettier:write": "prettier -c .prettierrc --write",
     "prettier": "npm run prettier:write \"src/**/*.{ts,tsx}\"",
     "publish:lib": "npm run build && cd lib && npm publish && cd ..",
     "report-coverage": "cat ./coverage/lcov.info | coveralls",
     "test:prod": "npm run lint && npm run test --coverage --no-cache",
     "test:watch": "jest --watch",
-    "test": "jest"
+    "test": "jest",
+    "tslint:check": "tslint-config-prettier-check ./tslint.json"
   },
   "husky": {
     "hooks": {

package.json

@@ -3,15 +3,10 @@ import { uglify } from 'rollup-plugin-uglify';
 import { terser } from 'rollup-plugin-terser';
 import pkg from './package.json';
 
-const externals = [
-  ...(Object.keys(pkg.dependencies) || {}),
-  ...(Object.keys(pkg.peerDependencies) || {}),
-];
-
 const createConfig = ({ output, plugins } = {}) => ({
   input: 'src/index.ts',
   output,
-  external: externals,
+  external: ['react', 'prop-types'],
   plugins: [
     typescript({
       useTsconfigDeclarationDir: true,
@@ -24,11 +19,11 @@ const createConfig = ({ output, plugins } = {}) => ({
 
 export default [
   createConfig({
-    output: { file: 'lib/index.js', format: 'cjs' },
+    output: { file: `lib/${pkg.main}`, format: 'cjs' },
     plugins: [uglify()],
   }),
   createConfig({
-    output: { file: 'lib/index.es.js', format: 'es' },
+    output: { file: `lib/${pkg.module}`, format: 'es' },
     plugins: [terser()],
   }),
 ];

rollup.config.js

@@ -1,7 +1,7 @@
 import * as PropTypes from 'prop-types';
 import * as React from 'react';
 
-type ListItemCallbackFn = (
+export type ListItemCallbackFn = (
   value?: any,
   index?: number,
   array?: any[],

src/components/List/List.tsx

@@ -1,42 +1,41 @@
 import * as PropTypes from 'prop-types';
 import * as React from 'react';
-import { isPromise } from '../../utils';
 
 export interface IResolveProps {
   /** The promise. */
-  promise?: Promise<any>;
+  promise: Promise<any>;
 
   /** Returns content when promise is resolved. */
-  resolved?: (value) => React.ReactNode;
+  resolved?: (value: any) => React.ReactNode;
 
   /** Returns content while promise is being handled. */
   pending?: React.ReactNode;
 
   /** Returns content when promise is rejected. */
-  rejected?: (error) => React.ReactNode;
+  rejected?: (error: any) => React.ReactNode;
 }
 
-const statusTypes = {
+export const statusTypes = {
   none: 'none',
   pending: 'pending',
   rejected: 'rejected',
   resolved: 'resolved',
 };
 
-const initialState = {
+export const initialState = {
   status: statusTypes.none,
   value: '',
 };
 
-type IResolveState = Readonly<typeof initialState>;
+export type IResolveState = Readonly<typeof initialState>;
 
 /**
  * Semantic helper component that returns content based on the status of the specified promise.
  */
 class Resolve extends React.Component<IResolveProps, IResolveState> {
   public static propTypes = {
     pending: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
-    promise: isPromise,
+    promise: PropTypes.instanceOf(Promise).isRequired,
     rejected: PropTypes.func,
     resolved: PropTypes.func,
   };
@@ -52,7 +51,7 @@ class Resolve extends React.Component<IResolveProps, IResolveState> {
     this.handlePromise(this.props.promise);
   }
 
-  public componentDidUpdate(prevProps) {
+  public componentDidUpdate(prevProps: IResolveProps) {
     if (this.props.promise !== prevProps.promise) {
       this.setState({
         status: statusTypes.none,
@@ -95,7 +94,7 @@ class Resolve extends React.Component<IResolveProps, IResolveState> {
   }
 
   // Promise resolver function
-  private handlePromise(promise) {
+  private handlePromise(promise: Promise<any>) {
     // Store the current promise to fast exit if promise is change during handling
     const currentPromise = promise;
     this.setState({

src/components/Resolve/Resolve.tsx

@@ -4,8 +4,7 @@ import * as React from 'react';
 import SwitchCase, { ISwitchCaseProps } from './SwitchCase';
 import SwitchDefault, { ISwitchDefaultProps } from './SwitchDefault';
 
-type SwitchChildProps = ISwitchCaseProps & ISwitchDefaultProps;
-
+export { ISwitchDefaultProps, ISwitchCaseProps };
 export interface ISwitchProps {
   /** Conditional statement. */
   value: any;
@@ -30,23 +29,20 @@ class Switch extends React.Component<ISwitchProps> {
 
   public render() {
     const switchValue = this.props.value;
-    let match;
-    let child;
+    let match: boolean | undefined;
+    let child: any;
 
-    React.Children.forEach(
-      this.props.children,
-      (element: React.ReactElement<SwitchChildProps>) => {
-        if (
-          match === undefined &&
-          React.isValidElement(element) &&
-          this.isValidChild(element)
-        ) {
-          const caseValue = element.props.value;
-          child = element;
-          match = caseValue === switchValue || undefined;
-        }
-      },
-    );
+    React.Children.forEach(this.props.children, element => {
+      if (
+        match === undefined &&
+        React.isValidElement(element) &&
+        this.isValidChild(element)
+      ) {
+        const caseValue = this.getElementValue(element);
+        child = element;
+        match = caseValue === switchValue || undefined;
+      }
+    });
 
     // No match found, return default if it exists.
     if (!match && this.isSwitchDefault(child)) {
@@ -57,15 +53,22 @@ class Switch extends React.Component<ISwitchProps> {
     return match ? React.cloneElement(child) : null;
   }
 
-  private isValidChild = child => {
+  private getElementValue = (element: any) => {
+    if (element && element.props) {
+      return element.props.value;
+    }
+    return undefined;
+  };
+
+  private isValidChild = (child: any) => {
     return this.isSwitchCase(child) || this.isSwitchDefault(child);
   };
 
-  private isSwitchCase = child => {
+  private isSwitchCase = (child: any) => {
     return child.type.prototype === SwitchCase.prototype;
   };
 
-  private isSwitchDefault = child => {
+  private isSwitchDefault = (child: any) => {
     return child.type.prototype === SwitchDefault.prototype;
   };
 }

src/components/Switch/Switch.tsx

@@ -16,7 +16,6 @@ export interface ISwitchCaseProps {
 
 /**
  * Semantic helper component that can be accessed from the `Switch` component.
- * Only ment to be used inside the children of the `Switch` component.
  */
 const SwitchCase: React.SFC<ISwitchCaseProps> = ({ value, render, children }) => {
   if (value !== undefined) {

src/components/Switch/SwitchCase.tsx

@@ -13,7 +13,6 @@ export interface ISwitchDefaultProps {
 
 /**
  * Semantic helper component that can be accessed from the `Switch` component.
- * Only ment to be used inside the children of the `Switch` component.
  */
 const SwitchDefault: React.SFC<ISwitchDefaultProps> = ({ render, children }) => {
   const value = '__SWITCH_CASE_VALUE_OVERRIDE_USE_THIS_AND_YOU_WILL_BE_FIRED__';

src/components/Switch/SwitchDefault.tsx

@@ -1,2 +1 @@
-export * from './isEmptyChildren/isEmptyChildren';
-export * from './isPromise/isPromise';
+export { default as isEmptyChildren } from './isEmptyChildren/isEmptyChildren';