shadowgiver
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.2 • Public • Published

    shadowgiver

    shadowgiver is a utility for react native and react native web to make shadows consistent across platforms. It takes in the most primitive object, an Android elevation, and turns it into a box shadow, and iOS shadow, and an elevation. Will only return the minimal number of keys.

    NPM Package

    Usage:

    install

    yarn add shadowgiver

    or

    npm install shadowgiver

    import { shadowgiver } from 'shadowgiver';
     
    StyleSheet.create({
      ...shadowgiver(4),
    });

    This project was bootstrapped with TSDX.

    Want to see under the hood? Heres the shadowgiver function:

    function shadowgiver(elevation, color) {
      const shadowOffset = { width: 0, height: 0.5 * elevation };
      const shadowOpacity = 0.3;
      const shadowRadius = 0.8 * elevation;
      const shadowColor = color || 'black';
      return Platform.select({
        ios: {
          shadowColor: 'black',
          shadowOpacity,
          shadowRadius,
          shadowOffset,
        },
        android: {
          elevation,
        },
        web: {
          boxShadow: `${shadowOffset.width}px ${shadowOffset.height}px ${shadowRadius}px ${shadowColor}`,
        },
      });
    }

    There's also a way to JUST output what's needed for web. Just instead import from shadowgiver/web!

    Package Development

    Below is a list of commands you will probably find useful.

    npm start or yarn start

    Runs the project in development/watch mode. Your project will be rebuilt upon changes. TSDX has a special logger for you convenience. Error messages are pretty printed and formatted for compatibility VS Code's Problems tab.

    Your library will be rebuilt if you make edits.

    npm run build or yarn build

    Bundles the package to the dist folder. The package is optimized and bundled with Rollup into multiple formats (CommonJS, UMD, and ES Module).

    MIT License

    Keywords

    none

    Install

    npm i shadowgiver

    DownloadsWeekly Downloads

    1

    Version

    1.1.2

    License

    MIT

    Unpacked Size

    22.7 kB

    Total Files

    19

    Last publish

    Collaborators

    • rjerue