Skip to content
Permalink
Browse files

fix: run eslint across the right files and fix any issues that arise. (

…#21)

* fix: run eslint on all files and fix errors

* fix: adjust for generated build assets

* fix: typos

* fix: just ignore all definition files
  • Loading branch information...
SiTaggart committed Aug 6, 2019
1 parent e7f2432 commit 2fcc872ff70903edcd8182e0d2d18966074c2e59
@@ -2,4 +2,8 @@
/bower_components/**
/packages/**/node_modules/**
**/lib/**
rollup.config.js
**/dist/**
**/paste-icons/react/
rollup.config.js
**/tsconfig.build.tsbuildinfo
**/*.d.ts
@@ -51,7 +51,8 @@ module.exports = {
// with babel compiled typescript.
'@typescript-eslint/no-var-requires': 'off',
// Enforce template strings for styles over objects for consistent codebase
'emotion/syntax-preference': [2, 'string'],
// We can switch this to object at anytime, but lowering to warn as we have a mixed condebase right now.
'emotion/syntax-preference': [1, 'string'],
// PropTypes are useless with typescript
'react/prop-types': 'off',
// Avoid having to redefine story deps for this monorepo
@@ -33,7 +33,7 @@
"test:coverage": "yarn pre-test && node --experimental-worker ./node_modules/.bin/jest --coverage",
"prettier": "prettier --list-different '{.storybook,packages}/**/*.{ts,tsx}'",
"prettier-clean": "prettier --write '{.storybook,packages}/**/*.{ts,tsx}'",
"lint": "eslint ./packages/**/*.ts ./packages/**/*.tsx ",
"lint": "eslint --ext .tsx,.ts ./packages/**",
"type-check": "lerna run type-check"
},
"dependencies": {
@@ -11,19 +11,19 @@ import {ButtonWrapperProps, ButtonChildrenProps} from './types';
const sizeReset = css`
padding: 0;
`;
const sizeIcon = (props: ButtonWrapperProps) => css`
const sizeIcon = (props: ButtonWrapperProps): SerializedStyles => css`
padding: ${themeGet('space.space30')(props)};
border-radius: ${themeGet('radii.borderRadius20')(props)};
/* To fix abnormal button padding-bottom */
line-height: unset;
`;
const sizeSmall = (props: ButtonWrapperProps) => css`
const sizeSmall = (props: ButtonWrapperProps): SerializedStyles => css`
padding: ${themeGet('space.space10')(props)} ${themeGet('space.space30')(props)};
border-radius: ${themeGet('radii.borderRadius10')(props)};
font-size: ${themeGet('fontSizes.fontSize20')(props)};
line-height: 24px;
`;
const sizeDefault = (props: ButtonWrapperProps) => css`
const sizeDefault = (props: ButtonWrapperProps): SerializedStyles => css`
padding: ${themeGet('space.space30')(props)} ${themeGet('space.space60')(props)};
border-radius: ${themeGet('radii.borderRadius20')(props)};
font-size: ${themeGet('fontSizes.fontSize20')(props)};
@@ -79,7 +79,7 @@ const baseDisabled = css([
* Variants
*/
// Primary
const variantPrimaryBase = (props: ButtonWrapperProps) => css`
const variantPrimaryBase = (props: ButtonWrapperProps): SerializedStyles => css`
border-width: ${themeGet('borderWidths.borderWidth10')(props)};
border-style: solid;
color: ${themeGet('textColors.colorTextInverse')(props)};
@@ -134,7 +134,7 @@ const variantPrimaryDisabled = (props: ButtonWrapperProps): SerializedStyles =>
]);

// Secondary
const variantSecondaryBase = (props: ButtonWrapperProps) => css`
const variantSecondaryBase = (props: ButtonWrapperProps): SerializedStyles => css`
border-width: ${themeGet('borderWidths.borderWidth10')(props)};
border-style: solid;
background-color: ${themeGet('backgroundColors.colorBackgroundBody')(props)};
@@ -182,7 +182,7 @@ const variantSecondaryDisabled = (props: ButtonWrapperProps): SerializedStyles =
]);

// Destructive
const variantDestructiveBase = (props: ButtonWrapperProps) => css`
const variantDestructiveBase = (props: ButtonWrapperProps): SerializedStyles => css`
border-width: ${themeGet('borderWidths.borderWidth10')(props)};
border-style: solid;
background-color: ${themeGet('backgroundColors.colorBackgroundBody')(props)};
@@ -26,7 +26,7 @@ interface SpinnerProps extends SpinnerIconProps {
title: string;
}

const Spinner = (props: SpinnerProps) => (
const Spinner: React.FC<SpinnerProps> = props => (
<SpinningWrapper>
<SpinnerIcon {...props} />
</SpinningWrapper>
@@ -1,9 +1,9 @@
import * as lodash from 'lodash';
import {ImmutableStyleMap} from 'theo';
import {Token} from '../types';
import getTokenCategories from '../utils/getTokenCategories';
import formatSingleTokensWithTemplate from '../utils/formatSingleTokensWithTemplate';
import formatGroupTokensWithTemplate from '../utils/formatGroupTokensWithTemplate';
import {getTokenCategories} from '../utils/getTokenCategories';
import {formatSingleTokensWithTemplate} from '../utils/formatSingleTokensWithTemplate';
import {formatGroupTokensWithTemplate} from '../utils/formatGroupTokensWithTemplate';

export const tokenTemplate = ({name, value}: {name: string; value: string}): string =>
`const ${lodash.camelCase(name)} = "${value.replace(/"/g, '\\"')}";`;
@@ -1,9 +1,9 @@
import * as lodash from 'lodash';
import {ImmutableStyleMap} from 'theo';
import {Token} from '../types';
import getTokenCategories from '../utils/getTokenCategories';
import formatSingleTokensWithTemplate from '../utils/formatSingleTokensWithTemplate';
import formatGroupTokensWithTemplate from '../utils/formatGroupTokensWithTemplate';
import {getTokenCategories} from '../utils/getTokenCategories';
import {formatSingleTokensWithTemplate} from '../utils/formatSingleTokensWithTemplate';
import {formatGroupTokensWithTemplate} from '../utils/formatGroupTokensWithTemplate';

export const tokenTemplate = ({name, value}: {name: string; value: string}): string =>
`export declare const ${lodash.camelCase(name)} = "${value}";`;
@@ -1,9 +1,9 @@
import * as lodash from 'lodash';
import {ImmutableStyleMap} from 'theo';
import {Token} from '../types';
import getTokenCategories from '../utils/getTokenCategories';
import formatSingleTokensWithTemplate from '../utils/formatSingleTokensWithTemplate';
import formatGroupTokensWithTemplate from '../utils/formatGroupTokensWithTemplate';
import {getTokenCategories} from '../utils/getTokenCategories';
import {formatSingleTokensWithTemplate} from '../utils/formatSingleTokensWithTemplate';
import {formatGroupTokensWithTemplate} from '../utils/formatGroupTokensWithTemplate';

export const tokenTemplate = ({name, value}: {name: string; value: string}): string =>
`export const ${lodash.camelCase(name)} = "${value.replace(/"/g, '\\"')}";`;
@@ -1,7 +1,7 @@
import {ImmutableStyleMap} from 'theo';
import {Token} from '../types';
import getTokenCategories from '../utils/getTokenCategories';
import formatGroupTokensWithTemplate from '../utils/formatGroupTokensWithTemplate';
import {getTokenCategories} from '../utils/getTokenCategories';
import {formatGroupTokensWithTemplate} from '../utils/formatGroupTokensWithTemplate';

export const categoryTemplate = (categoryName: string, props: Token[]): string => {
return `{
@@ -44,13 +44,13 @@ const getPluralCatName = (name: string): string => {
return pluralName;
};

export default (
export const formatGroupTokensWithTemplate = (
tokens: ImmutableStyleMap,
categories: any,
categoryTemplate: (cat: string, props: Token[]) => void
categoryTemplate: (cat: string, props: Token[]) => string
): string => {
return categories
.map((cat: string) => {
.map((cat: string): string | undefined => {
const catProps = tokens
.get('props')
.sortBy(prop => {
@@ -64,6 +64,7 @@ export default (
if (typeof cat === 'string') {
return categoryTemplate(getPluralCatName(cat), catProps);
}
return undefined;
})
.join('\n');
};
@@ -1,18 +1,22 @@
import {ImmutableStyleMap} from 'theo';
import {Token} from '../../types';

export default (tokens: ImmutableStyleMap, tokenTemplate: (prop: Token) => void) => {
export const formatSingleTokensWithTemplate = (
tokens: ImmutableStyleMap,
tokenTemplate: (prop: Token) => string
): string => {
return tokens
.get('props')
.sortBy(prop => {
if (prop !== undefined) {
return prop.get('name');
}
})
.map(prop => {
.map((prop): string | undefined => {
if (prop !== undefined) {
return tokenTemplate(prop.toJS());
}
return undefined;
})
.join('\n');
};
@@ -1,12 +1,13 @@
import {ImmutableStyleMap} from 'theo';

export default (tokens: ImmutableStyleMap) => {
export const getTokenCategories = (tokens: ImmutableStyleMap): any => {
return tokens
.get('props')
.map(prop => {
.map((prop): string | number | undefined => {
if (prop !== undefined) {
return prop.get('category');
}
return undefined;
})
.toSet()
.sort();
@@ -6,7 +6,12 @@ import {Table, Tbody, Tr, Th, Td} from '../../table';
interface PasteMDXProviderProps {
children?: React.ReactElement;
}

/* eslint-disable no-shadow */
/*
"error 'props' is already declared in the upper scope": these errors I don't
think are actually real. Because top level props is actually a different set of
props than that are passed to the components. I think eslint is confused.
*/
export const PasteMDXProvider: React.FC<PasteMDXProviderProps> = (props: PasteMDXProviderProps): React.ReactElement => {
return (
<MDXProvider
@@ -55,3 +60,4 @@ export const PasteMDXProvider: React.FC<PasteMDXProviderProps> = (props: PasteMD
</MDXProvider>
);
};
/* eslint-enable no-shadow */

1 comment on commit 2fcc872

@now

This comment has been minimized.

Copy link

now bot commented on 2fcc872 Aug 6, 2019

Deployment failed with the following error:

The domain used as an alias twilio.design is not verified yet. Please verify it.
Please sign in to comment.
You can’t perform that action at this time.