benmneb / mui-image

⚛ React component to display images as per the Material Design guidelines. For apps using Material-UI v5.
https://mui-image.surge.sh
ISC License
50 stars 14 forks source link

Support for Typescript #2

Closed ThukuWakogi closed 2 years ago

ThukuWakogi commented 2 years ago

Could you add support for TypeScript?

benmneb commented 2 years ago

I don't know TypeScript... but PR's are open!

kerkness commented 2 years ago

I'm not familiar enough with typescript to submit a PR but type support can be gained by adding the following to your app.

./types/mui-image/index.d.ts

declare module 'mui-image' {

    import React from 'react';

    export interface MuiImageProps {
        alt?: string;
        bgColor?: string;
        className?: string;
        distance?: string | number;
        duration?: number;
        easing?: string;
        errorIcon?: boolean | React.ReactNode;
        fit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' | 'inherit' | 'initial' | 'revert' | 'unset';
        height?: string | number;
        iconWrapperClassName?: string;
        iconWrapperStyle?: any;
        position?: 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky' | 'inherit' | 'initial' | 'revert' | 'unset';
        shift?: 'left' | 'right' | 'top' | 'bottom' | false | null;
        shiftDuration?: number;
        showLoading?: boolean | React.ReactNode;
        src: string;
        style?: any;
        width?: string | number;
        wrapperClassName?: string;
        wrapperStyle?: any;
    };

    declare const Image: React.SFC<MuiImageProps>;

    export default Image;

};

Then add the path to the typeRoots options in in your tsconfig.json like the following

{
    "compilerOptions": {
          "typeRoots": ["./types"]
    }
}
Nerdy-Girl commented 2 years ago

Created a PR for this one :v:

benmneb commented 2 years ago

I tried config-ing NWB to support typescript, then tried copying everything over to a new TSDX component but it ended up being easier to just make @types/mui-image. So just install that and everything should be fine!