UNPKG

@eslam-elmeniawy/react-native-common-components

Version:

Common `ReactNative` components packed in library for usage in projects.

128 lines (124 loc) 5.03 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var React = _interopRequireWildcard(require("react")); var _reactNative = require("react-native"); var _reactNativePaper = require("react-native-paper"); var _tinycolor = _interopRequireDefault(require("tinycolor2")); var _ButtonStyles = _interopRequireDefault(require("./Button.styles.js")); var _index = require("../Text/index.js"); var _Icon = _interopRequireDefault(require("./Icon.js")); var _ResponsiveDimensions = _interopRequireDefault(require("../../utils/ResponsiveDimensions.js")); var _jsxRuntime = require("react/jsx-runtime"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } // External imports. // Types imports. // Internal imports. const Button = /*#__PURE__*/React.memo(props => { const { text, startImage, startVector, startIconName, endImage, endVector, endIconName, onPress, onLongPress, onPressIn, onPressOut, disabled, iconSize, noIconTint, textProps, style, theme, ...other } = props; const { style: textStyle, type, ...rest } = textProps ?? {}; const _enabledStyle = { opacity: disabled ? 0.5 : 1.0 }; const _buttonDefaultBackgroundStyle = { backgroundColor: theme.colors.primary }; const _buttonColor = _reactNative.StyleSheet.flatten(style ?? _buttonDefaultBackgroundStyle).backgroundColor?.toString() ?? theme.colors.primary; const _defaultTextColorNonV3 = (0, _tinycolor.default)(_buttonColor).isDark() ? '#ffffff' : '#000000'; const _defaultTextColor = theme.isV3 ? theme.colors.onPrimary : _defaultTextColorNonV3; const _textColor = textStyle == null || textStyle === undefined ? _defaultTextColor : _reactNative.StyleSheet.flatten(textStyle).color?.toString() ?? _defaultTextColor; const _rippleColor = (0, _tinycolor.default)(_textColor).setAlpha(0.25).toHex8String(); const _iconSize = _ResponsiveDimensions.default.ms(iconSize ?? 24); const _iconColor = noIconTint ? undefined : _textColor; const _flattenStyle = _reactNative.StyleSheet.flatten(style ?? {}); const { padding, paddingHorizontal, paddingVertical, paddingTop, paddingBottom, paddingStart, paddingEnd, paddingRight, paddingLeft } = _flattenStyle; const _borderRadius = (theme.isV3 ? 5 : 1) * theme.roundness; return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, { style: _reactNative.StyleSheet.flatten([_ButtonStyles.default.container, { backgroundColor: theme.colors.primary, borderRadius: _borderRadius }, style, _enabledStyle, _ButtonStyles.default.noPadding]), ...other, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativePaper.TouchableRipple, { onPress: onPress, onLongPress: onLongPress, onPressIn: onPressIn, onPressOut: onPressOut, disabled: disabled, rippleColor: _rippleColor, underlayColor: _rippleColor, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, { style: _reactNative.StyleSheet.flatten([_ButtonStyles.default.rippleView, { padding, paddingHorizontal, paddingVertical, paddingTop, paddingBottom, paddingStart, paddingEnd, paddingRight, paddingLeft }]), children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, { image: startImage, vector: startVector, iconName: startIconName, size: _iconSize, color: _iconColor }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, { style: _reactNative.StyleSheet.flatten([_ButtonStyles.default.text, { color: _textColor }, textStyle]), type: type ?? 'bold', ...rest, children: text }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, { image: endImage, vector: endVector, iconName: endIconName, size: _iconSize, color: _iconColor })] }) }) }); }); var _default = exports.default = (0, _reactNativePaper.withTheme)(Button); //# sourceMappingURL=Button.js.map