react-native-expo-image-cache icon indicating copy to clipboard operation
react-native-expo-image-cache copied to clipboard

TypeScript declaration

Open Piropa opened this issue 7 years ago • 9 comments

Nice component William,

I program using typescript, then I had to make my own "d.ts" script for your components.

Here it is, though pretty simple, hope it's usefull:

## reactNativeExpoImageCache.d.ts

declare module 'react-native-expo-image-cache' {
  import React from "react"
  import { ImageStyle, ViewStyle } from "react-native"

  export function Image(
    style: ViewStyle & ImageStyle,
    preview: string,
    uri: string
  ): React.Component
  
  type Listener = (uri: string) => any

  export class CacheManager {
    static listeners: { [uri: string]: Listener[] }
    static cache: (uri: string, listener: Listener) => Promise<void>
  }

}

Piropa avatar Mar 03 '18 01:03 Piropa

@Piropa Nice! Is it possible to contribute it to @types/react-native-expo-image-cache? If not, I would be ok to add it to this repo.

wcandillon avatar Mar 03 '18 06:03 wcandillon

Gladly

Piropa avatar Mar 03 '18 06:03 Piropa

@wcandillon, This would be the corresponding index.d.ts file:

import React from "react"
import { Animated, ImageStyle } from "react-native"

interface ImageProps {
  style?: ImageStyle
  preview?: string
  uri: string
}

interface ImageState {
  uri: string
  intensity: Animated.Value
}

export class Image extends React.Component<ImageProps, ImageState> {}

type Listener = (uri: string) => void

export class CacheManager {
  static async cache(uri: string, listener: Listener): Promise<void>
}

Is this what you requested?

Piropa avatar Mar 07 '18 20:03 Piropa

@Piropa This is great! Could you see if this can be contributed to @types/react-native-expo-image-cache? If not, I can add it this repository.

wcandillon avatar Mar 08 '18 08:03 wcandillon

I don't know how to do it.... as I told you before, I'm completely new to Github, however, the current tendency is to include the typescript declaration within the delivered modules with an index.d.ts file at the code root.

I will wait until you have all the new modifications within the master branch to update this file to the new definitions.

Piropa avatar Mar 08 '18 21:03 Piropa

Is this already in @types/react-native-expo-image-cache? When I try to install that package, yarn & npm both complain that there is no such package.

jhwheeler avatar Jul 18 '18 16:07 jhwheeler

I would be ok to add it as index.d.ts, then it would be picked up automatically by TypeScript right? But now the API has changed, I would need to update it. If you have one that works for you, feel free to contribute.

wcandillon avatar Jul 19 '18 11:07 wcandillon

@wcandillon - It would be much better if you can include it in the repo and maintain it with updates. @types packages often lag behind on updates for smaller libraries such as this one

jhalborg avatar Nov 29 '18 08:11 jhalborg

as of 12/4/2018 these typings is 1 to 1 to your own flow documentation.

declare module 'react-native-expo-image-cache' {
  import React from 'react';
  import { Animated, ImageStyle, ImageSourcePropType } from 'react-native';

  export interface DownloadOptions = {
    md5?: boolean;
    headers?: { [string]: string };
  };

  export interface ImageProps {
    style?: ImageStyle;
    defaultSource?: ImageSourcePropType;
    preview?: ImageSourcePropType;
    options?: DownloadOptions;
    uri: string;
    transitionDuration?: number;
    tint?: 'dark' | 'light';
  }

  interface ImageState {
    uri: string;
    intensity: Animated.Value;
  }

  export class Image extends React.Component<ImageProps, ImageState> {}

  type Listener = (uri: string) => void;

  export class CacheManager {
    static async cache(uri: string, listener: Listener): Promise<void>;
  }
}

Simmetopia avatar Dec 04 '18 13:12 Simmetopia