@prosperitainova/dumbo-react-native
Version:
Dumbo for React Native Library
109 lines (105 loc) • 3.02 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ErrorState = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _helpers = require("../../helpers");
var _Text = require("../Text");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const accessImage = require('./access_error.png');
const emptyImage = require('./empty_error.png');
const genericImage = require('./generic_error.png');
/** Types of errors */
/** Props for ErrorState component */
/**
* ErrorState component for showing an error message and screen
*
* {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/ErrorState.tsx | Example code}
*/
class ErrorState extends _react.default.Component {
get styles() {
return _reactNative.StyleSheet.create({
wrapper: {
flexDirection: 'row',
flexWrap: 'wrap'
},
image: {
width: 320,
height: 405,
margin: 16,
marginRight: 32
},
textWrapper: {
flex: 1,
minWidth: 300
},
title: {
marginBottom: 16
},
subTitle: {
marginBottom: 16
},
errorCode: {}
});
}
get image() {
const {
customImage,
type
} = this.props;
if (customImage) {
return customImage;
}
switch (type) {
case 'access':
return accessImage;
case 'empty':
return emptyImage;
case 'generic':
default:
return genericImage;
}
}
render() {
const {
componentProps,
style,
title,
subTitle,
errorCode,
imageStyle,
noImage
} = this.props;
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
style: (0, _helpers.styleReferenceBreaker)(this.styles.wrapper, style),
accessibilityLabel: title,
accessibilityHint: subTitle + ' ' + errorCode,
accessibilityRole: "summary",
...(componentProps || {}),
children: [!noImage && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
resizeMode: "contain",
style: (0, _helpers.styleReferenceBreaker)(this.styles.image, imageStyle),
source: this.image
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
style: this.styles.textWrapper,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
style: this.styles.title,
text: title,
type: "heading-04"
}), !!subTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
style: this.styles.subTitle,
text: subTitle
}), !!errorCode && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
style: this.styles.errorCode,
text: errorCode,
type: "code-02"
})]
})]
});
}
}
exports.ErrorState = ErrorState;
//# sourceMappingURL=index.js.map