react95-native/dist/module/components/Panel/Panel.js

Refreshed Windows 95 style UI components for your React Native app

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import { StyleSheet, Animated } from 'react-native';
import { withTheme } from '../../core/theming';
import { Border } from '../../styles/styleElements';
import shadow from '../../styles/shadow';
export const testId = 'panel'; // TODO: common interface with styleElements/Border ?

const Panel = ({
  background = 'material',
  children,
  elevation = 0,
  invert = false,
  radius = 0,
  style = {},
  theme,
  variant = 'default',
  ...rest
}) => {
  const getBackgroundColor = () => {
    return theme[background];
  };

  return (
    /*#__PURE__*/
    // TODO: fix this TS error
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    // @ts-ignore
    React.createElement(Animated.View, _extends({}, rest, {
      style: [styles.container, {
        padding: variant === 'well' ? 2 : 4,
        backgroundColor: getBackgroundColor(),
        borderRadius: radius
      }, shadow(elevation), style],
      testID: testId
    }), variant !== 'clear' && /*#__PURE__*/React.createElement(Border, {
      theme: theme,
      variant: variant,
      radius: radius,
      invert: invert
    }), children)
  );
};

const styles = StyleSheet.create({
  container: {
    position: 'relative'
  }
});
export default withTheme(Panel);
//# sourceMappingURL=Panel.js.map