feat(borrow): add more types

index.d.ts

@@ -25,3 +25,8 @@ declare module 'daggy' {
 
   export function taggedSum(typename: string, constructor: IConstructor): Remote
 }
+
+declare module '*.png'
+declare module '*.svg'
+declare module '*.gif'
+declare module '*.jpg'

packages/blockchain-info-components/index.d.ts

@@ -1,32 +1,157 @@
-import { StatelessComponent, CSSProperties } from 'react'
+import {
+  StatelessComponent,
+  PureComponent,
+  CSSProperties,
+  ComponentElement
+} from 'react'
 import { DefaultTheme } from 'styled-components'
+import { IcoMoonType } from './src/Icons/Icomoon'
+import { ImageType } from './src/Images/Images'
 
-export function BlockchainLoader(...args: any): any
-export function Button(...args: any): any
-export function ComponentDropdown(...args): any
-export function FontGlobalStyles(...args: any): any
-export function HeartbeatLoader(...args: any): any
-export function Icon(...args: any): any
-export function IconGlobalStyles(...args: any): any
-export function Image(...args: any): any
-export function Link(...args: any): any
-export function Modal(...args: any): any
-export function ModalBody(...args: any): any
-export function ModalHeader(...args: any): any
+export const BlockchainLoader: StatelessComponent<{
+  width?: string
+  height?: string
+}>
+export const Button: StatelessComponent<
+  {
+    nature?:
+      | 'copy'
+      | 'dark'
+      | 'empty-secondary'
+      | 'empty'
+      | 'gray-3'
+      | 'green'
+      | 'light'
+      | 'primary'
+      | 'purple'
+      | 'received'
+      | 'secondary'
+      | 'sent'
+      | 'success'
+      | 'transferred'
+      | 'warning'
+      | 'white-transparent'
+    fullwidth?: boolean
+    disabled?: boolean
+    rounded?: boolean
+    bold?: boolean
+    small?: boolean
+    uppercase?: boolean
+    capitalize?: boolean
+    width?: string
+    padding?: string
+    margin?: string
+    jumbo?: boolean
+    height?: string
+    className?: string
+    onClick?: () => void
+    style?: CSSProperties
+  } & React.ButtonHTMLAttributes<{}>
+>
+
+export const ComponentDropdown: React.ComponentClass<{
+  components: Array<JSX.Element>
+  color?: string
+  toggleOnClassback?: boolean
+  opened?: boolean
+  uppercase?: boolean
+  down?: boolean
+  forceSelected?: boolean
+  selectedComponent?: JSX.Element
+  onClick?: () => void
+  callback?: () => void
+}>
+
+export const FontGlobalStyles: StatelessComponent<{}>
+export const HeartbeatLoader: StatelessComponent<{
+  width?: string
+  height?: string
+  color?: keyof DefaultTheme
+}>
+export const Icon: StatelessComponent<{
+  name: keyof IcoMoonType
+  weight?: number
+  size?: string
+  cursor?: boolean
+  color?: string
+  style?: CSSProperties
+  onClick?: () => void
+}>
+export const IconGlobalStyles: StatelessComponent<{}>
+export const Image: StatelessComponent<{
+  name: keyof ImageType
+  width?: string
+  height?: string
+  color?: string
+  size?: string
+}>
+export const Link: StatelessComponent<{
+  weight?: number
+  size?: string
+  color?: keyof DefaultTheme
+  uppercase?: boolean
+  capitalize?: boolean
+  bold?: boolean
+  href?: string
+  target?: string
+  rel?: string
+  style?: CSSProperties
+  onClick?: () => void
+}>
+export const Modal: StatelessComponent<{
+  size?: '' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'
+  type?: 'tray' | 'flyout'
+  position?: number
+  total?: number
+  width?: number
+  isLast?: boolean
+  dataE2e?: string
+  style?: CSSProperties
+}>
+export const ModalBody: StatelessComponent<{
+  loading?: boolean
+}>
+export const ModalHeader: StatelessComponent<{
+  closeButton?: boolean
+  onClose?: () => void
+  icon?: keyof IcoMoonType
+}>
 export function Palette(theme: string): DefaultTheme
-export function SkeletonRectangle(...args: any): any
-export function SpinningLoader(...args: any): any
-export function Table(...args): any
-export function TableCell(...args): any
-export function TableHeader(...args): any
-export function TableRow(...args): any
+export const SkeletonRectangle: StatelessComponent<{
+  width?: string
+  height?: string
+  bgColor?: keyof DefaultTheme
+}>
+export const SpinningLoader: StatelessComponent<{
+  width?: string
+  height?: string
+}>
+export const Table: StatelessComponent<{
+  style?: CSSProperties
+}>
+export const TableCell: StatelessComponent<{
+  onClick?: () => void
+  width?: string
+  hideMobile?: boolean
+}>
+export const TableHeader: StatelessComponent<{}>
+export const TableRow: StatelessComponent<{}>
 export const Text: StatelessComponent<{
   color?: keyof DefaultTheme
   size?: string
   weight?: number
   style?: CSSProperties
   uppercase?: boolean
   lineHeight?: string
+  capitazlie?: boolean
+  italic?: boolean
+  altFont?: boolean
+  cursor?: string
+  opacity?: string
   onClick?: () => void
 }>
-export function TextGroup(...args: any): any
+export const TextGroup: StatelessComponent<{
+  nowrap?: boolean
+  inline?: boolean
+  style?: CSSProperties
+}>

packages/blockchain-info-components/src/Icons/Icomoon.js → packages/blockchain-info-components/src/Icons/Icomoon.ts

@@ -1,4 +1,4 @@
-export default {
+const IcoMoon = {
   'alert-filled': '\\e900',
   'arrow-down': '\\e91d',
   'arrow-down-circle': '\\e935',
@@ -95,3 +95,5 @@ export default {
   xlm: '\\e930',
   'xlm-circle-filled': '\\e91f'
 }
+export type IcoMoonType = typeof IcoMoon
+export default IcoMoon

packages/blockchain-info-components/src/Images/Images.js → packages/blockchain-info-components/src/Images/Images.ts

@@ -103,7 +103,7 @@ import sendReview from './img/lockbox/send-review.png'
 import sendReview2 from './img/lockbox/send-review@2x.png'
 import sendReview3 from './img/lockbox/send-review@3x.png'
 
-export default {
+const Images = {
   'airdrop-enrolled': airdropEnrolled,
   'airdrop-welcome-banner': airdropWelcomeBanner,
   'airdrop-welcome-banner2': airdropWelcomeBanner2,
@@ -208,3 +208,6 @@ export default {
   'warning-circle-filled': warningCircleFilled,
   yubikey: yubikey
 }
+
+export type ImageType = typeof Images
+export default Images

packages/blockchain-info-components/src/Modals/Modal.js

@@ -106,7 +106,7 @@ const Modal = props => {
 Modal.propTypes = {
   position: PropTypes.number,
   total: PropTypes.number,
-  size: PropTypes.oneOf(['small', 'medium', 'large', 'xlarge', ''])
+  size: PropTypes.oneOf(['xsmall', 'small', 'medium', 'large', 'xlarge', ''])
 }
 
 export default Modal

packages/blockchain-info-components/src/Text/TextGroup.js

@@ -19,8 +19,8 @@ const TextGroup = props => {
 }
 
 TextGroup.propTypes = {
-  nowrap: PropTypes.bool.isRequired,
-  inline: PropTypes.bool.isRequired
+  nowrap: PropTypes.bool,
+  inline: PropTypes.bool
 }
 
 TextGroup.defaultProps = {

packages/blockchain-wallet-v4/src/redux/walletOptions/types.ts

@@ -1,4 +1,5 @@
 import { CoinType } from '../../types'
+import { IcoMoonType } from 'blockchain-info-components/src/Icons/Icomoon'
 
 export type SupportedCoinType = {
   availability: {
@@ -18,9 +19,9 @@ export type SupportedCoinType = {
   displayName: string
   hasLockboxSupport: boolean
   icons: {
-    circle: string
-    circleFilled: string
-    default: string
+    circle: keyof IcoMoonType
+    circleFilled: keyof IcoMoonType
+    default: keyof IcoMoonType
   }
   learnMoreLink: string
   minConfirmations: number