rn-custom-style-sheet
Version:
React Native component to select a specific value from a range of values.
83 lines (82 loc) • 4.43 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styled = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _ = require("../..");
var _MediaQuery = require("../../../MediaQuery");
var _Scaling = require("../../../Scaling");
var _Theming = require("../../../Theming");
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 && Object.prototype.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; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
const styled = Component => (style, options) => {
const {
attrs,
children
} = options || {};
return props => {
const {
device,
isDisableScaling,
style: inlineStyles,
...restProps
} = props;
const localIsDisableScaling = isDisableScaling ?? false;
const localAppThemeName = (0, _Theming.useCurrentThemeName)();
const localThemeMode = (0, _Theming.useCurrentThemeMode)();
const localDevice = (0, _MediaQuery.useDevice)(device);
const localScreenResolution = (0, _.useScreenResolution)();
const localGeneralScreenResolution = (0, _.useGeneralScreenResolution)();
const localGuideLineLayout = (0, _.useGuideLineLayout)();
const localGuideLineBreakpoint = (0, _.useGuideLineBreakpoint)();
const localCurrentBreakpointIndex = (0, _.useCurrentBreakpointIndex)();
const isDark = localThemeMode === 'dark';
const StyledProps = {
...restProps,
styleOption: {
themeMode: localThemeMode,
themeName: localAppThemeName,
isDark
}
};
const computedStyles = style instanceof Function ? style(StyledProps) : style;
const styles = (0, _react.useMemo)(() => {
const newStyles = Array.isArray(computedStyles) ? [...computedStyles, inlineStyles] : [computedStyles, inlineStyles];
return (0, _Scaling.styleProcess)({
// @ts-ignore
styles: _reactNative.StyleSheet.flatten(newStyles),
device: localDevice,
guideLineBreakpoint: localGuideLineBreakpoint,
scaleFunc: localIsDisableScaling ? undefined : (0, _Scaling.scaleFunc)(localScreenResolution, localGuideLineLayout, localGuideLineBreakpoint, localGeneralScreenResolution, localCurrentBreakpointIndex)
});
}, [inlineStyles, computedStyles, localDevice, localGuideLineBreakpoint, localIsDisableScaling, localScreenResolution, localGuideLineLayout, localCurrentBreakpointIndex, localGeneralScreenResolution]);
const computedProps = {
...props,
...(attrs || {})
};
Component.displayName = Component.displayName || Component.name;
if (children) {
return /*#__PURE__*/_react.default.createElement(Component, _extends({}, computedProps, {
style: styles
}), children);
} else {
return /*#__PURE__*/_react.default.createElement(Component, _extends({}, computedProps, {
style: styles
}));
}
};
};
exports.styled = styled;
styled.SafeAreaView = styled(_reactNative.SafeAreaView);
styled.View = styled(_reactNative.View);
styled.Text = styled(_reactNative.Text);
styled.TextInput = styled(_reactNative.TextInput);
styled.Image = styled(_reactNative.Image);
styled.FlatList = styled(_reactNative.FlatList);
styled.ScrollView = styled(_reactNative.ScrollView);
styled.SectionList = styled(_reactNative.SectionList);
styled.TouchableOpacity = styled(_reactNative.TouchableOpacity);
//# sourceMappingURL=CustomStyleComponent.js.map