fluent-styles 1.10.0 → 1.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/package/header/index.js +2 -2
- package/lib/commonjs/package/header/index.js.map +1 -1
- package/lib/commonjs/package/utils/statusBar.js +70 -0
- package/lib/commonjs/package/utils/statusBar.js.map +1 -0
- package/lib/module/package/header/index.js +1 -1
- package/lib/module/package/header/index.js.map +1 -1
- package/lib/module/package/utils/statusBar.js +57 -0
- package/lib/module/package/utils/statusBar.js.map +1 -0
- package/package.json +1 -2
- package/src/package/header/index.jsx +1 -1
- package/src/package/utils/statusBar.js +65 -0
|
@@ -7,7 +7,6 @@ exports.StyledHeader = void 0;
|
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
var _MaterialIcons = _interopRequireDefault(require("react-native-vector-icons/MaterialIcons"));
|
|
10
|
-
var _reactNativeStatusBarHeight = require("react-native-status-bar-height");
|
|
11
10
|
var _theme = require("../theme");
|
|
12
11
|
var _stack = require("../stack");
|
|
13
12
|
var _styled = require("../styled");
|
|
@@ -15,6 +14,7 @@ var _cycle = require("../cycle");
|
|
|
15
14
|
var _text = require("../text");
|
|
16
15
|
var _spacer = require("../spacer");
|
|
17
16
|
var _utils = require("../utils");
|
|
17
|
+
var _statusBar = require("../utils/statusBar");
|
|
18
18
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
19
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
20
20
|
const Headers = (0, _styled.styled)(_reactNative.View, {
|
|
@@ -50,7 +50,7 @@ const StyledHeader = ({
|
|
|
50
50
|
backgroundColor: _theme.theme.colors.gray[1],
|
|
51
51
|
barStyle: 'dark-content'
|
|
52
52
|
}, statusProps)), /*#__PURE__*/_react.default.createElement(Headers, _extends({
|
|
53
|
-
statusHeight: (0,
|
|
53
|
+
statusHeight: (0, _statusBar.getStatusBarHeight)(skipAndroid)
|
|
54
54
|
}, rest)));
|
|
55
55
|
};
|
|
56
56
|
exports.StyledHeader = StyledHeader;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_MaterialIcons","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_MaterialIcons","_theme","_stack","_styled","_cycle","_text","_spacer","_utils","_statusBar","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","Headers","styled","View","base","width","flexDirection","alignItems","justifyContent","variants","marginTop","size","isValidNumber","Error","statusHeight","height","paddingTop","StyledHeader","statusProps","skipAndroid","rest","createElement","YStack","StatusBar","translucent","backgroundColor","theme","colors","gray","barStyle","getStatusBarHeight","exports","Header","navigator","title","icon","cycleProps","reload","screen","XStack","flex","paddingHorizontal","paddingVertical","StyledCycle","Fragment","name","color","onPress","replace","goBack","StyledSpacer","marginHorizontal","StyledText","fontWeight","normal","fontSize","Full","children"],"sources":["index.jsx"],"sourcesContent":["import React from 'react'\r\nimport { View } from 'react-native'\r\nimport { StatusBar } from 'react-native'\r\nimport Icon from 'react-native-vector-icons/MaterialIcons'\r\nimport { theme } from '../theme'\r\nimport { YStack, XStack } from '../stack'\r\nimport { styled } from '../styled'\r\nimport { StyledCycle } from '../cycle'\r\nimport { StyledText } from '../text'\r\nimport { StyledSpacer } from '../spacer'\r\nimport { isValidNumber } from '../utils'\r\nimport { getStatusBarHeight } from '../utils/statusBar'\r\n\r\nconst Headers = styled(View, {\r\n base: {\r\n width: '100%',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n justifyContent: 'flex-start'\r\n },\r\n variants: {\r\n marginTop: (size = 0) => {\r\n if (!isValidNumber(size)) {\r\n throw new Error('Invalid marginTop value')\r\n }\r\n return { marginTop: size }\r\n },\r\n statusHeight: (height = 0) => {\r\n return { paddingTop: height }\r\n }\r\n }\r\n})\r\n\r\nconst StyledHeader = ({ statusProps, skipAndroid = false, ...rest }) => {\r\n return (\r\n <YStack>\r\n <StatusBar\r\n translucent\r\n backgroundColor={theme.colors.gray[1]}\r\n barStyle={'dark-content'}\r\n {...statusProps}\r\n />\r\n <Headers statusHeight={getStatusBarHeight(skipAndroid)} {...rest} />\r\n </YStack>\r\n )\r\n}\r\n\r\nconst Header = ({ navigator, title, icon = false, cycleProps, reload = false, screen, ...rest }) => {\r\n\r\n return (\r\n <XStack justifyContent='flex-start' alignItems='center' flex={1} paddingHorizontal={8}\r\n paddingVertical={8} {...rest}>\r\n {\r\n icon && (\r\n <StyledCycle {...cycleProps}>\r\n <>\r\n <Icon\r\n name={'arrow-back'}\r\n size={30}\r\n color={theme.colors.gray[700]}\r\n onPress={() => {\r\n if (reload && screen && navigator) {\r\n navigator.replace(screen)\r\n } else {\r\n navigator.goBack()\r\n }\r\n }}\r\n />\r\n <StyledSpacer marginHorizontal={4} />\r\n </>\r\n </StyledCycle>\r\n )\r\n }\r\n {title &&\r\n <StyledText\r\n color={theme.colors.gray[800]}\r\n fontWeight={theme.fontWeight.normal}\r\n fontSize={theme.fontSize.normal}\r\n >\r\n {title}\r\n </StyledText>}\r\n </XStack>\r\n )\r\n}\r\n\r\nconst Full = ({ children }) => {\r\n return (\r\n <>{children}</>\r\n )\r\n}\r\n\r\nStyledHeader.Header = Header\r\nStyledHeader.Full = Full\r\n\r\nexport { StyledHeader }\r\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,cAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,MAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA;AACA,IAAAQ,OAAA,GAAAR,OAAA;AACA,IAAAS,MAAA,GAAAT,OAAA;AACA,IAAAU,UAAA,GAAAV,OAAA;AAAuD,SAAAD,uBAAAY,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,SAAA,WAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,CAAA,aAAAP,CAAA,MAAAA,CAAA,GAAAQ,SAAA,CAAAC,MAAA,EAAAT,CAAA,UAAAU,CAAA,GAAAF,SAAA,CAAAR,CAAA,YAAAW,CAAA,IAAAD,CAAA,OAAAE,cAAA,CAAAC,IAAA,CAAAH,CAAA,EAAAC,CAAA,MAAAJ,CAAA,CAAAI,CAAA,IAAAD,CAAA,CAAAC,CAAA,aAAAJ,CAAA,KAAAJ,QAAA,CAAAW,KAAA,OAAAN,SAAA;AAEvD,MAAMO,OAAO,GAAG,IAAAC,cAAM,EAACC,iBAAI,EAAE;EAC3BC,IAAI,EAAE;IACJC,KAAK,EAAE,MAAM;IACbC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDC,QAAQ,EAAE;IACRC,SAAS,EAAEA,CAACC,IAAI,GAAG,CAAC,KAAK;MACvB,IAAI,CAAC,IAAAC,oBAAa,EAACD,IAAI,CAAC,EAAE;QACxB,MAAM,IAAIE,KAAK,CAAC,yBAAyB,CAAC;MAC5C;MACA,OAAO;QAAEH,SAAS,EAAEC;MAAK,CAAC;IAC5B,CAAC;IACDG,YAAY,EAAEA,CAACC,MAAM,GAAG,CAAC,KAAK;MAC5B,OAAO;QAAEC,UAAU,EAAED;MAAO,CAAC;IAC/B;EACF;AACF,CAAC,CAAC;AAEF,MAAME,YAAY,GAAGA,CAAC;EAAEC,WAAW;EAAEC,WAAW,GAAG,KAAK;EAAE,GAAGC;AAAK,CAAC,KAAK;EACtE,oBACE/C,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAC1C,MAAA,CAAA2C,MAAM,qBACLjD,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAC7C,YAAA,CAAA+C,SAAS,EAAAlC,QAAA;IACRmC,WAAW;IACXC,eAAe,EAAEC,YAAK,CAACC,MAAM,CAACC,IAAI,CAAC,CAAC,CAAE;IACtCC,QAAQ,EAAE;EAAe,GACrBX,WAAW,CAChB,CAAC,eACF7C,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAACpB,OAAO,EAAAZ,QAAA;IAACyB,YAAY,EAAE,IAAAgB,6BAAkB,EAACX,WAAW;EAAE,GAAKC,IAAI,CAAG,CAC7D,CAAC;AAEb,CAAC;AAAAW,OAAA,CAAAd,YAAA,GAAAA,YAAA;AAED,MAAMe,MAAM,GAAGA,CAAC;EAAEC,SAAS;EAAEC,KAAK;EAAEC,IAAI,GAAG,KAAK;EAAEC,UAAU;EAAEC,MAAM,GAAG,KAAK;EAAEC,MAAM;EAAE,GAAGlB;AAAK,CAAC,KAAK;EAElG,oBACE/C,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAC1C,MAAA,CAAA4D,MAAM,EAAAlD,QAAA;IAACmB,cAAc,EAAC,YAAY;IAACD,UAAU,EAAC,QAAQ;IAACiC,IAAI,EAAE,CAAE;IAACC,iBAAiB,EAAE,CAAE;IACpFC,eAAe,EAAE;EAAE,GAAKtB,IAAI,GAE1Be,IAAI,iBACF9D,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAACxC,MAAA,CAAA8D,WAAW,EAAMP,UAAU,eAC1B/D,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAAhD,MAAA,CAAAe,OAAA,CAAAwD,QAAA,qBACEvE,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAC5C,cAAA,CAAAW,OAAI;IACHyD,IAAI,EAAE,YAAa;IACnBlC,IAAI,EAAE,EAAG;IACTmC,KAAK,EAAEpB,YAAK,CAACC,MAAM,CAACC,IAAI,CAAC,GAAG,CAAE;IAC9BmB,OAAO,EAAEA,CAAA,KAAM;MACb,IAAIV,MAAM,IAAIC,MAAM,IAAIL,SAAS,EAAE;QACjCA,SAAS,CAACe,OAAO,CAACV,MAAM,CAAC;MAC3B,CAAC,MAAM;QACLL,SAAS,CAACgB,MAAM,CAAC,CAAC;MACpB;IACF;EAAE,CACH,CAAC,eACF5E,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAACtC,OAAA,CAAAmE,YAAY;IAACC,gBAAgB,EAAE;EAAE,CAAE,CACpC,CACS,CACd,EAEFjB,KAAK,iBACJ7D,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAACvC,KAAA,CAAAsE,UAAU;IACTN,KAAK,EAAEpB,YAAK,CAACC,MAAM,CAACC,IAAI,CAAC,GAAG,CAAE;IAC9ByB,UAAU,EAAE3B,YAAK,CAAC2B,UAAU,CAACC,MAAO;IACpCC,QAAQ,EAAE7B,YAAK,CAAC6B,QAAQ,CAACD;EAAO,GAE/BpB,KACS,CACR,CAAC;AAEb,CAAC;AAED,MAAMsB,IAAI,GAAGA,CAAC;EAAEC;AAAS,CAAC,KAAK;EAC7B,oBACEpF,MAAA,CAAAe,OAAA,CAAAiC,aAAA,CAAAhD,MAAA,CAAAe,OAAA,CAAAwD,QAAA,QAAGa,QAAW,CAAC;AAEnB,CAAC;AAEDxC,YAAY,CAACe,MAAM,GAAGA,MAAM;AAC5Bf,YAAY,CAACuC,IAAI,GAAGA,IAAI","ignoreList":[]}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getStatusBarHeight = getStatusBarHeight;
|
|
7
|
+
exports.isIPhoneXMax = exports.isIPhoneX = exports.isIPhoneWithMonobrow = exports.isIPhone12Max = exports.isIPhone12 = exports.isExpo = void 0;
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
const STATUSBAR_DEFAULT_HEIGHT = 20;
|
|
10
|
+
const STATUSBAR_X_HEIGHT = 44;
|
|
11
|
+
const STATUSBAR_IP12_HEIGHT = 47;
|
|
12
|
+
const STATUSBAR_IP12MAX_HEIGHT = 47;
|
|
13
|
+
const X_WIDTH = 375;
|
|
14
|
+
const X_HEIGHT = 812;
|
|
15
|
+
const XSMAX_WIDTH = 414;
|
|
16
|
+
const XSMAX_HEIGHT = 896;
|
|
17
|
+
const IP12_WIDTH = 390;
|
|
18
|
+
const IP12_HEIGHT = 844;
|
|
19
|
+
const IP12MAX_WIDTH = 428;
|
|
20
|
+
const IP12MAX_HEIGHT = 926;
|
|
21
|
+
const {
|
|
22
|
+
height: W_HEIGHT,
|
|
23
|
+
width: W_WIDTH
|
|
24
|
+
} = _reactNative.Dimensions.get('window');
|
|
25
|
+
let statusBarHeight = STATUSBAR_DEFAULT_HEIGHT;
|
|
26
|
+
let isIPhoneX_v = false;
|
|
27
|
+
let isIPhoneXMax_v = false;
|
|
28
|
+
let isIPhone12_v = false;
|
|
29
|
+
let isIPhone12Max_v = false;
|
|
30
|
+
let isIPhoneWithMonobrow_v = false;
|
|
31
|
+
if (_reactNative.Platform.OS === 'ios' && !_reactNative.Platform.isPad && !_reactNative.Platform.isTVOS) {
|
|
32
|
+
if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {
|
|
33
|
+
isIPhoneWithMonobrow_v = true;
|
|
34
|
+
isIPhoneX_v = true;
|
|
35
|
+
statusBarHeight = STATUSBAR_X_HEIGHT;
|
|
36
|
+
} else if (W_WIDTH === XSMAX_WIDTH && W_HEIGHT === XSMAX_HEIGHT) {
|
|
37
|
+
isIPhoneWithMonobrow_v = true;
|
|
38
|
+
isIPhoneXMax_v = true;
|
|
39
|
+
statusBarHeight = STATUSBAR_X_HEIGHT;
|
|
40
|
+
} else if (W_WIDTH === IP12_WIDTH && W_HEIGHT === IP12_HEIGHT) {
|
|
41
|
+
isIPhoneWithMonobrow_v = true;
|
|
42
|
+
isIPhone12_v = true;
|
|
43
|
+
statusBarHeight = STATUSBAR_IP12_HEIGHT;
|
|
44
|
+
} else if (W_WIDTH === IP12MAX_WIDTH && W_HEIGHT === IP12MAX_HEIGHT) {
|
|
45
|
+
isIPhoneWithMonobrow_v = true;
|
|
46
|
+
isIPhone12Max_v = true;
|
|
47
|
+
statusBarHeight = STATUSBAR_IP12MAX_HEIGHT;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
const isIPhoneX = () => isIPhoneX_v;
|
|
51
|
+
exports.isIPhoneX = isIPhoneX;
|
|
52
|
+
const isIPhoneXMax = () => isIPhoneXMax_v;
|
|
53
|
+
exports.isIPhoneXMax = isIPhoneXMax;
|
|
54
|
+
const isIPhone12 = () => isIPhone12_v;
|
|
55
|
+
exports.isIPhone12 = isIPhone12;
|
|
56
|
+
const isIPhone12Max = () => isIPhone12Max_v;
|
|
57
|
+
exports.isIPhone12Max = isIPhone12Max;
|
|
58
|
+
const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v;
|
|
59
|
+
exports.isIPhoneWithMonobrow = isIPhoneWithMonobrow;
|
|
60
|
+
const getExpoRoot = () => global.Expo || global.__expo || global.__exponent;
|
|
61
|
+
const isExpo = () => getExpoRoot() !== undefined;
|
|
62
|
+
exports.isExpo = isExpo;
|
|
63
|
+
function getStatusBarHeight(skipAndroid) {
|
|
64
|
+
return _reactNative.Platform.select({
|
|
65
|
+
ios: statusBarHeight,
|
|
66
|
+
android: skipAndroid ? 0 : _reactNative.StatusBar.currentHeight,
|
|
67
|
+
default: 0
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
//# sourceMappingURL=statusBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNative","require","STATUSBAR_DEFAULT_HEIGHT","STATUSBAR_X_HEIGHT","STATUSBAR_IP12_HEIGHT","STATUSBAR_IP12MAX_HEIGHT","X_WIDTH","X_HEIGHT","XSMAX_WIDTH","XSMAX_HEIGHT","IP12_WIDTH","IP12_HEIGHT","IP12MAX_WIDTH","IP12MAX_HEIGHT","height","W_HEIGHT","width","W_WIDTH","Dimensions","get","statusBarHeight","isIPhoneX_v","isIPhoneXMax_v","isIPhone12_v","isIPhone12Max_v","isIPhoneWithMonobrow_v","Platform","OS","isPad","isTVOS","isIPhoneX","exports","isIPhoneXMax","isIPhone12","isIPhone12Max","isIPhoneWithMonobrow","getExpoRoot","global","Expo","__expo","__exponent","isExpo","undefined","getStatusBarHeight","skipAndroid","select","ios","android","StatusBar","currentHeight","default"],"sources":["statusBar.js"],"sourcesContent":["import { Dimensions, Platform, StatusBar } from 'react-native'\r\n\r\nconst STATUSBAR_DEFAULT_HEIGHT = 20\r\nconst STATUSBAR_X_HEIGHT = 44\r\nconst STATUSBAR_IP12_HEIGHT = 47\r\nconst STATUSBAR_IP12MAX_HEIGHT = 47\r\n\r\nconst X_WIDTH = 375\r\nconst X_HEIGHT = 812\r\n\r\nconst XSMAX_WIDTH = 414\r\nconst XSMAX_HEIGHT = 896\r\n\r\nconst IP12_WIDTH = 390\r\nconst IP12_HEIGHT = 844\r\n\r\nconst IP12MAX_WIDTH = 428\r\nconst IP12MAX_HEIGHT = 926\r\n\r\nconst { height: W_HEIGHT, width: W_WIDTH } = Dimensions.get('window')\r\n\r\nlet statusBarHeight = STATUSBAR_DEFAULT_HEIGHT\r\nlet isIPhoneX_v = false\r\nlet isIPhoneXMax_v = false\r\nlet isIPhone12_v = false\r\nlet isIPhone12Max_v = false\r\nlet isIPhoneWithMonobrow_v = false\r\n\r\nif (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {\r\n if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhoneX_v = true\r\n statusBarHeight = STATUSBAR_X_HEIGHT\r\n } else if (W_WIDTH === XSMAX_WIDTH && W_HEIGHT === XSMAX_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhoneXMax_v = true\r\n statusBarHeight = STATUSBAR_X_HEIGHT\r\n } else if (W_WIDTH === IP12_WIDTH && W_HEIGHT === IP12_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhone12_v = true\r\n statusBarHeight = STATUSBAR_IP12_HEIGHT\r\n } else if (W_WIDTH === IP12MAX_WIDTH && W_HEIGHT === IP12MAX_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhone12Max_v = true\r\n statusBarHeight = STATUSBAR_IP12MAX_HEIGHT\r\n }\r\n}\r\n\r\nexport const isIPhoneX = () => isIPhoneX_v\r\nexport const isIPhoneXMax = () => isIPhoneXMax_v\r\nexport const isIPhone12 = () => isIPhone12_v\r\nexport const isIPhone12Max = () => isIPhone12Max_v\r\nexport const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v\r\n\r\nconst getExpoRoot = () => global.Expo || global.__expo || global.__exponent\r\n\r\nexport const isExpo = () => getExpoRoot() !== undefined\r\n\r\nexport function getStatusBarHeight (skipAndroid) {\r\n return Platform.select({\r\n ios: statusBarHeight,\r\n android: skipAndroid ? 0 : StatusBar.currentHeight,\r\n default: 0\r\n })\r\n}\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,7 +3,6 @@ import React from 'react';
|
|
|
3
3
|
import { View } from 'react-native';
|
|
4
4
|
import { StatusBar } from 'react-native';
|
|
5
5
|
import Icon from 'react-native-vector-icons/MaterialIcons';
|
|
6
|
-
import { getStatusBarHeight } from 'react-native-status-bar-height';
|
|
7
6
|
import { theme } from '../theme';
|
|
8
7
|
import { YStack, XStack } from '../stack';
|
|
9
8
|
import { styled } from '../styled';
|
|
@@ -11,6 +10,7 @@ import { StyledCycle } from '../cycle';
|
|
|
11
10
|
import { StyledText } from '../text';
|
|
12
11
|
import { StyledSpacer } from '../spacer';
|
|
13
12
|
import { isValidNumber } from '../utils';
|
|
13
|
+
import { getStatusBarHeight } from '../utils/statusBar';
|
|
14
14
|
const Headers = styled(View, {
|
|
15
15
|
base: {
|
|
16
16
|
width: '100%',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","View","StatusBar","Icon","
|
|
1
|
+
{"version":3,"names":["React","View","StatusBar","Icon","theme","YStack","XStack","styled","StyledCycle","StyledText","StyledSpacer","isValidNumber","getStatusBarHeight","Headers","base","width","flexDirection","alignItems","justifyContent","variants","marginTop","size","Error","statusHeight","height","paddingTop","StyledHeader","statusProps","skipAndroid","rest","createElement","_extends","translucent","backgroundColor","colors","gray","barStyle","Header","navigator","title","icon","cycleProps","reload","screen","flex","paddingHorizontal","paddingVertical","Fragment","name","color","onPress","replace","goBack","marginHorizontal","fontWeight","normal","fontSize","Full","children"],"sources":["index.jsx"],"sourcesContent":["import React from 'react'\r\nimport { View } from 'react-native'\r\nimport { StatusBar } from 'react-native'\r\nimport Icon from 'react-native-vector-icons/MaterialIcons'\r\nimport { theme } from '../theme'\r\nimport { YStack, XStack } from '../stack'\r\nimport { styled } from '../styled'\r\nimport { StyledCycle } from '../cycle'\r\nimport { StyledText } from '../text'\r\nimport { StyledSpacer } from '../spacer'\r\nimport { isValidNumber } from '../utils'\r\nimport { getStatusBarHeight } from '../utils/statusBar'\r\n\r\nconst Headers = styled(View, {\r\n base: {\r\n width: '100%',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n justifyContent: 'flex-start'\r\n },\r\n variants: {\r\n marginTop: (size = 0) => {\r\n if (!isValidNumber(size)) {\r\n throw new Error('Invalid marginTop value')\r\n }\r\n return { marginTop: size }\r\n },\r\n statusHeight: (height = 0) => {\r\n return { paddingTop: height }\r\n }\r\n }\r\n})\r\n\r\nconst StyledHeader = ({ statusProps, skipAndroid = false, ...rest }) => {\r\n return (\r\n <YStack>\r\n <StatusBar\r\n translucent\r\n backgroundColor={theme.colors.gray[1]}\r\n barStyle={'dark-content'}\r\n {...statusProps}\r\n />\r\n <Headers statusHeight={getStatusBarHeight(skipAndroid)} {...rest} />\r\n </YStack>\r\n )\r\n}\r\n\r\nconst Header = ({ navigator, title, icon = false, cycleProps, reload = false, screen, ...rest }) => {\r\n\r\n return (\r\n <XStack justifyContent='flex-start' alignItems='center' flex={1} paddingHorizontal={8}\r\n paddingVertical={8} {...rest}>\r\n {\r\n icon && (\r\n <StyledCycle {...cycleProps}>\r\n <>\r\n <Icon\r\n name={'arrow-back'}\r\n size={30}\r\n color={theme.colors.gray[700]}\r\n onPress={() => {\r\n if (reload && screen && navigator) {\r\n navigator.replace(screen)\r\n } else {\r\n navigator.goBack()\r\n }\r\n }}\r\n />\r\n <StyledSpacer marginHorizontal={4} />\r\n </>\r\n </StyledCycle>\r\n )\r\n }\r\n {title &&\r\n <StyledText\r\n color={theme.colors.gray[800]}\r\n fontWeight={theme.fontWeight.normal}\r\n fontSize={theme.fontSize.normal}\r\n >\r\n {title}\r\n </StyledText>}\r\n </XStack>\r\n )\r\n}\r\n\r\nconst Full = ({ children }) => {\r\n return (\r\n <>{children}</>\r\n )\r\n}\r\n\r\nStyledHeader.Header = Header\r\nStyledHeader.Full = Full\r\n\r\nexport { StyledHeader }\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { Dimensions, Platform, StatusBar } from 'react-native';
|
|
2
|
+
const STATUSBAR_DEFAULT_HEIGHT = 20;
|
|
3
|
+
const STATUSBAR_X_HEIGHT = 44;
|
|
4
|
+
const STATUSBAR_IP12_HEIGHT = 47;
|
|
5
|
+
const STATUSBAR_IP12MAX_HEIGHT = 47;
|
|
6
|
+
const X_WIDTH = 375;
|
|
7
|
+
const X_HEIGHT = 812;
|
|
8
|
+
const XSMAX_WIDTH = 414;
|
|
9
|
+
const XSMAX_HEIGHT = 896;
|
|
10
|
+
const IP12_WIDTH = 390;
|
|
11
|
+
const IP12_HEIGHT = 844;
|
|
12
|
+
const IP12MAX_WIDTH = 428;
|
|
13
|
+
const IP12MAX_HEIGHT = 926;
|
|
14
|
+
const {
|
|
15
|
+
height: W_HEIGHT,
|
|
16
|
+
width: W_WIDTH
|
|
17
|
+
} = Dimensions.get('window');
|
|
18
|
+
let statusBarHeight = STATUSBAR_DEFAULT_HEIGHT;
|
|
19
|
+
let isIPhoneX_v = false;
|
|
20
|
+
let isIPhoneXMax_v = false;
|
|
21
|
+
let isIPhone12_v = false;
|
|
22
|
+
let isIPhone12Max_v = false;
|
|
23
|
+
let isIPhoneWithMonobrow_v = false;
|
|
24
|
+
if (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {
|
|
25
|
+
if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {
|
|
26
|
+
isIPhoneWithMonobrow_v = true;
|
|
27
|
+
isIPhoneX_v = true;
|
|
28
|
+
statusBarHeight = STATUSBAR_X_HEIGHT;
|
|
29
|
+
} else if (W_WIDTH === XSMAX_WIDTH && W_HEIGHT === XSMAX_HEIGHT) {
|
|
30
|
+
isIPhoneWithMonobrow_v = true;
|
|
31
|
+
isIPhoneXMax_v = true;
|
|
32
|
+
statusBarHeight = STATUSBAR_X_HEIGHT;
|
|
33
|
+
} else if (W_WIDTH === IP12_WIDTH && W_HEIGHT === IP12_HEIGHT) {
|
|
34
|
+
isIPhoneWithMonobrow_v = true;
|
|
35
|
+
isIPhone12_v = true;
|
|
36
|
+
statusBarHeight = STATUSBAR_IP12_HEIGHT;
|
|
37
|
+
} else if (W_WIDTH === IP12MAX_WIDTH && W_HEIGHT === IP12MAX_HEIGHT) {
|
|
38
|
+
isIPhoneWithMonobrow_v = true;
|
|
39
|
+
isIPhone12Max_v = true;
|
|
40
|
+
statusBarHeight = STATUSBAR_IP12MAX_HEIGHT;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
export const isIPhoneX = () => isIPhoneX_v;
|
|
44
|
+
export const isIPhoneXMax = () => isIPhoneXMax_v;
|
|
45
|
+
export const isIPhone12 = () => isIPhone12_v;
|
|
46
|
+
export const isIPhone12Max = () => isIPhone12Max_v;
|
|
47
|
+
export const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v;
|
|
48
|
+
const getExpoRoot = () => global.Expo || global.__expo || global.__exponent;
|
|
49
|
+
export const isExpo = () => getExpoRoot() !== undefined;
|
|
50
|
+
export function getStatusBarHeight(skipAndroid) {
|
|
51
|
+
return Platform.select({
|
|
52
|
+
ios: statusBarHeight,
|
|
53
|
+
android: skipAndroid ? 0 : StatusBar.currentHeight,
|
|
54
|
+
default: 0
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
//# sourceMappingURL=statusBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Dimensions","Platform","StatusBar","STATUSBAR_DEFAULT_HEIGHT","STATUSBAR_X_HEIGHT","STATUSBAR_IP12_HEIGHT","STATUSBAR_IP12MAX_HEIGHT","X_WIDTH","X_HEIGHT","XSMAX_WIDTH","XSMAX_HEIGHT","IP12_WIDTH","IP12_HEIGHT","IP12MAX_WIDTH","IP12MAX_HEIGHT","height","W_HEIGHT","width","W_WIDTH","get","statusBarHeight","isIPhoneX_v","isIPhoneXMax_v","isIPhone12_v","isIPhone12Max_v","isIPhoneWithMonobrow_v","OS","isPad","isTVOS","isIPhoneX","isIPhoneXMax","isIPhone12","isIPhone12Max","isIPhoneWithMonobrow","getExpoRoot","global","Expo","__expo","__exponent","isExpo","undefined","getStatusBarHeight","skipAndroid","select","ios","android","currentHeight","default"],"sources":["statusBar.js"],"sourcesContent":["import { Dimensions, Platform, StatusBar } from 'react-native'\r\n\r\nconst STATUSBAR_DEFAULT_HEIGHT = 20\r\nconst STATUSBAR_X_HEIGHT = 44\r\nconst STATUSBAR_IP12_HEIGHT = 47\r\nconst STATUSBAR_IP12MAX_HEIGHT = 47\r\n\r\nconst X_WIDTH = 375\r\nconst X_HEIGHT = 812\r\n\r\nconst XSMAX_WIDTH = 414\r\nconst XSMAX_HEIGHT = 896\r\n\r\nconst IP12_WIDTH = 390\r\nconst IP12_HEIGHT = 844\r\n\r\nconst IP12MAX_WIDTH = 428\r\nconst IP12MAX_HEIGHT = 926\r\n\r\nconst { height: W_HEIGHT, width: W_WIDTH } = Dimensions.get('window')\r\n\r\nlet statusBarHeight = STATUSBAR_DEFAULT_HEIGHT\r\nlet isIPhoneX_v = false\r\nlet isIPhoneXMax_v = false\r\nlet isIPhone12_v = false\r\nlet isIPhone12Max_v = false\r\nlet isIPhoneWithMonobrow_v = false\r\n\r\nif (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {\r\n if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhoneX_v = true\r\n statusBarHeight = STATUSBAR_X_HEIGHT\r\n } else if (W_WIDTH === XSMAX_WIDTH && W_HEIGHT === XSMAX_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhoneXMax_v = true\r\n statusBarHeight = STATUSBAR_X_HEIGHT\r\n } else if (W_WIDTH === IP12_WIDTH && W_HEIGHT === IP12_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhone12_v = true\r\n statusBarHeight = STATUSBAR_IP12_HEIGHT\r\n } else if (W_WIDTH === IP12MAX_WIDTH && W_HEIGHT === IP12MAX_HEIGHT) {\r\n isIPhoneWithMonobrow_v = true\r\n isIPhone12Max_v = true\r\n statusBarHeight = STATUSBAR_IP12MAX_HEIGHT\r\n }\r\n}\r\n\r\nexport const isIPhoneX = () => isIPhoneX_v\r\nexport const isIPhoneXMax = () => isIPhoneXMax_v\r\nexport const isIPhone12 = () => isIPhone12_v\r\nexport const isIPhone12Max = () => isIPhone12Max_v\r\nexport const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v\r\n\r\nconst getExpoRoot = () => global.Expo || global.__expo || global.__exponent\r\n\r\nexport const isExpo = () => getExpoRoot() !== undefined\r\n\r\nexport function getStatusBarHeight (skipAndroid) {\r\n return Platform.select({\r\n ios: statusBarHeight,\r\n android: skipAndroid ? 0 : StatusBar.currentHeight,\r\n default: 0\r\n })\r\n}\r\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,cAAc;AAE9D,MAAMC,wBAAwB,GAAG,EAAE;AACnC,MAAMC,kBAAkB,GAAG,EAAE;AAC7B,MAAMC,qBAAqB,GAAG,EAAE;AAChC,MAAMC,wBAAwB,GAAG,EAAE;AAEnC,MAAMC,OAAO,GAAG,GAAG;AACnB,MAAMC,QAAQ,GAAG,GAAG;AAEpB,MAAMC,WAAW,GAAG,GAAG;AACvB,MAAMC,YAAY,GAAG,GAAG;AAExB,MAAMC,UAAU,GAAG,GAAG;AACtB,MAAMC,WAAW,GAAG,GAAG;AAEvB,MAAMC,aAAa,GAAG,GAAG;AACzB,MAAMC,cAAc,GAAG,GAAG;AAE1B,MAAM;EAAEC,MAAM,EAAEC,QAAQ;EAAEC,KAAK,EAAEC;AAAQ,CAAC,GAAGlB,UAAU,CAACmB,GAAG,CAAC,QAAQ,CAAC;AAErE,IAAIC,eAAe,GAAGjB,wBAAwB;AAC9C,IAAIkB,WAAW,GAAG,KAAK;AACvB,IAAIC,cAAc,GAAG,KAAK;AAC1B,IAAIC,YAAY,GAAG,KAAK;AACxB,IAAIC,eAAe,GAAG,KAAK;AAC3B,IAAIC,sBAAsB,GAAG,KAAK;AAElC,IAAIxB,QAAQ,CAACyB,EAAE,KAAK,KAAK,IAAI,CAACzB,QAAQ,CAAC0B,KAAK,IAAI,CAAC1B,QAAQ,CAAC2B,MAAM,EAAE;EAChE,IAAIV,OAAO,KAAKX,OAAO,IAAIS,QAAQ,KAAKR,QAAQ,EAAE;IAChDiB,sBAAsB,GAAG,IAAI;IAC7BJ,WAAW,GAAG,IAAI;IAClBD,eAAe,GAAGhB,kBAAkB;EACtC,CAAC,MAAM,IAAIc,OAAO,KAAKT,WAAW,IAAIO,QAAQ,KAAKN,YAAY,EAAE;IAC/De,sBAAsB,GAAG,IAAI;IAC7BH,cAAc,GAAG,IAAI;IACrBF,eAAe,GAAGhB,kBAAkB;EACtC,CAAC,MAAM,IAAIc,OAAO,KAAKP,UAAU,IAAIK,QAAQ,KAAKJ,WAAW,EAAE;IAC7Da,sBAAsB,GAAG,IAAI;IAC7BF,YAAY,GAAG,IAAI;IACnBH,eAAe,GAAGf,qBAAqB;EACzC,CAAC,MAAM,IAAIa,OAAO,KAAKL,aAAa,IAAIG,QAAQ,KAAKF,cAAc,EAAE;IACnEW,sBAAsB,GAAG,IAAI;IAC7BD,eAAe,GAAG,IAAI;IACtBJ,eAAe,GAAGd,wBAAwB;EAC5C;AACF;AAEA,OAAO,MAAMuB,SAAS,GAAGA,CAAA,KAAMR,WAAW;AAC1C,OAAO,MAAMS,YAAY,GAAGA,CAAA,KAAMR,cAAc;AAChD,OAAO,MAAMS,UAAU,GAAGA,CAAA,KAAMR,YAAY;AAC5C,OAAO,MAAMS,aAAa,GAAGA,CAAA,KAAMR,eAAe;AAClD,OAAO,MAAMS,oBAAoB,GAAGA,CAAA,KAAMR,sBAAsB;AAEhE,MAAMS,WAAW,GAAGA,CAAA,KAAMC,MAAM,CAACC,IAAI,IAAID,MAAM,CAACE,MAAM,IAAIF,MAAM,CAACG,UAAU;AAE3E,OAAO,MAAMC,MAAM,GAAGA,CAAA,KAAML,WAAW,CAAC,CAAC,KAAKM,SAAS;AAEvD,OAAO,SAASC,kBAAkBA,CAAEC,WAAW,EAAE;EAC/C,OAAOzC,QAAQ,CAAC0C,MAAM,CAAC;IACrBC,GAAG,EAAExB,eAAe;IACpByB,OAAO,EAAEH,WAAW,GAAG,CAAC,GAAGxC,SAAS,CAAC4C,aAAa;IAClDC,OAAO,EAAE;EACX,CAAC,CAAC;AACJ","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fluent-styles",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.11.0",
|
|
4
4
|
"description": "Develop different styled versions of UI components.",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -26,7 +26,6 @@
|
|
|
26
26
|
"homepage": "https://github.com/suftnetrepo/fluent-styles#readme",
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"react-native-dropdown-picker": "^5.4.6",
|
|
29
|
-
"react-native-status-bar-height": "^2.6.0",
|
|
30
29
|
"react-native-vector-icons": "^9.2.0"
|
|
31
30
|
},
|
|
32
31
|
"files": [
|
|
@@ -2,7 +2,6 @@ import React from 'react'
|
|
|
2
2
|
import { View } from 'react-native'
|
|
3
3
|
import { StatusBar } from 'react-native'
|
|
4
4
|
import Icon from 'react-native-vector-icons/MaterialIcons'
|
|
5
|
-
import { getStatusBarHeight } from 'react-native-status-bar-height';
|
|
6
5
|
import { theme } from '../theme'
|
|
7
6
|
import { YStack, XStack } from '../stack'
|
|
8
7
|
import { styled } from '../styled'
|
|
@@ -10,6 +9,7 @@ import { StyledCycle } from '../cycle'
|
|
|
10
9
|
import { StyledText } from '../text'
|
|
11
10
|
import { StyledSpacer } from '../spacer'
|
|
12
11
|
import { isValidNumber } from '../utils'
|
|
12
|
+
import { getStatusBarHeight } from '../utils/statusBar'
|
|
13
13
|
|
|
14
14
|
const Headers = styled(View, {
|
|
15
15
|
base: {
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Dimensions, Platform, StatusBar } from 'react-native'
|
|
2
|
+
|
|
3
|
+
const STATUSBAR_DEFAULT_HEIGHT = 20
|
|
4
|
+
const STATUSBAR_X_HEIGHT = 44
|
|
5
|
+
const STATUSBAR_IP12_HEIGHT = 47
|
|
6
|
+
const STATUSBAR_IP12MAX_HEIGHT = 47
|
|
7
|
+
|
|
8
|
+
const X_WIDTH = 375
|
|
9
|
+
const X_HEIGHT = 812
|
|
10
|
+
|
|
11
|
+
const XSMAX_WIDTH = 414
|
|
12
|
+
const XSMAX_HEIGHT = 896
|
|
13
|
+
|
|
14
|
+
const IP12_WIDTH = 390
|
|
15
|
+
const IP12_HEIGHT = 844
|
|
16
|
+
|
|
17
|
+
const IP12MAX_WIDTH = 428
|
|
18
|
+
const IP12MAX_HEIGHT = 926
|
|
19
|
+
|
|
20
|
+
const { height: W_HEIGHT, width: W_WIDTH } = Dimensions.get('window')
|
|
21
|
+
|
|
22
|
+
let statusBarHeight = STATUSBAR_DEFAULT_HEIGHT
|
|
23
|
+
let isIPhoneX_v = false
|
|
24
|
+
let isIPhoneXMax_v = false
|
|
25
|
+
let isIPhone12_v = false
|
|
26
|
+
let isIPhone12Max_v = false
|
|
27
|
+
let isIPhoneWithMonobrow_v = false
|
|
28
|
+
|
|
29
|
+
if (Platform.OS === 'ios' && !Platform.isPad && !Platform.isTVOS) {
|
|
30
|
+
if (W_WIDTH === X_WIDTH && W_HEIGHT === X_HEIGHT) {
|
|
31
|
+
isIPhoneWithMonobrow_v = true
|
|
32
|
+
isIPhoneX_v = true
|
|
33
|
+
statusBarHeight = STATUSBAR_X_HEIGHT
|
|
34
|
+
} else if (W_WIDTH === XSMAX_WIDTH && W_HEIGHT === XSMAX_HEIGHT) {
|
|
35
|
+
isIPhoneWithMonobrow_v = true
|
|
36
|
+
isIPhoneXMax_v = true
|
|
37
|
+
statusBarHeight = STATUSBAR_X_HEIGHT
|
|
38
|
+
} else if (W_WIDTH === IP12_WIDTH && W_HEIGHT === IP12_HEIGHT) {
|
|
39
|
+
isIPhoneWithMonobrow_v = true
|
|
40
|
+
isIPhone12_v = true
|
|
41
|
+
statusBarHeight = STATUSBAR_IP12_HEIGHT
|
|
42
|
+
} else if (W_WIDTH === IP12MAX_WIDTH && W_HEIGHT === IP12MAX_HEIGHT) {
|
|
43
|
+
isIPhoneWithMonobrow_v = true
|
|
44
|
+
isIPhone12Max_v = true
|
|
45
|
+
statusBarHeight = STATUSBAR_IP12MAX_HEIGHT
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export const isIPhoneX = () => isIPhoneX_v
|
|
50
|
+
export const isIPhoneXMax = () => isIPhoneXMax_v
|
|
51
|
+
export const isIPhone12 = () => isIPhone12_v
|
|
52
|
+
export const isIPhone12Max = () => isIPhone12Max_v
|
|
53
|
+
export const isIPhoneWithMonobrow = () => isIPhoneWithMonobrow_v
|
|
54
|
+
|
|
55
|
+
const getExpoRoot = () => global.Expo || global.__expo || global.__exponent
|
|
56
|
+
|
|
57
|
+
export const isExpo = () => getExpoRoot() !== undefined
|
|
58
|
+
|
|
59
|
+
export function getStatusBarHeight (skipAndroid) {
|
|
60
|
+
return Platform.select({
|
|
61
|
+
ios: statusBarHeight,
|
|
62
|
+
android: skipAndroid ? 0 : StatusBar.currentHeight,
|
|
63
|
+
default: 0
|
|
64
|
+
})
|
|
65
|
+
}
|