@tecsinapse/react-native-kit 1.12.7 → 1.12.11
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/CHANGELOG.md +32 -0
- package/dist/components/atoms/BottomNavigator/styled.js +4 -2
- package/dist/components/atoms/BottomNavigator/styled.js.map +1 -1
- package/dist/components/atoms/Input/styled.js +1 -1
- package/dist/components/atoms/Input/styled.js.map +1 -1
- package/dist/components/atoms/Modal/ui/styled.js +6 -4
- package/dist/components/atoms/Modal/ui/styled.js.map +1 -1
- package/dist/components/atoms/Select/styled.js +2 -2
- package/dist/components/atoms/Select/styled.js.map +1 -1
- package/package.json +3 -3
- package/src/components/atoms/BottomNavigator/styled.ts +3 -3
- package/src/components/atoms/Input/styled.ts +3 -2
- package/src/components/atoms/Modal/ui/styled.ts +5 -5
- package/src/components/atoms/Select/styled.ts +4 -3
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,38 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.12.11](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.10...@tecsinapse/react-native-kit@1.12.11) (2022-01-17)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [1.12.10](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.9...@tecsinapse/react-native-kit@1.12.10) (2022-01-11)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [1.12.9](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.8...@tecsinapse/react-native-kit@1.12.9) (2022-01-06)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## [1.12.8](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.7...@tecsinapse/react-native-kit@1.12.8) (2022-01-05)
|
|
31
|
+
|
|
32
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
6
38
|
## [1.12.7](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.6...@tecsinapse/react-native-kit@1.12.7) (2022-01-04)
|
|
7
39
|
|
|
8
40
|
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
@@ -7,6 +7,8 @@ exports.CustomTabContent = exports.TabContent = exports.TabContainer = exports.S
|
|
|
7
7
|
|
|
8
8
|
var _native = _interopRequireDefault(require("@emotion/native"));
|
|
9
9
|
|
|
10
|
+
var _reactCore = require("@tecsinapse/react-core");
|
|
11
|
+
|
|
10
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
13
|
|
|
12
14
|
const StyledView = _native.default.View`
|
|
@@ -33,7 +35,7 @@ const TabContainer = _native.default.Pressable`
|
|
|
33
35
|
}) => theme.spacing.deca};
|
|
34
36
|
border-top-width: ${({
|
|
35
37
|
selected
|
|
36
|
-
}) => selected ? '2px' : 0};
|
|
38
|
+
}) => selected ? (0, _reactCore.RFValueStr)('2px') : 0};
|
|
37
39
|
border-color: ${({
|
|
38
40
|
theme
|
|
39
41
|
}) => theme.color.primary.medium};
|
|
@@ -45,7 +47,7 @@ const TabContent = _native.default.View`
|
|
|
45
47
|
aspect-ratio: 1;
|
|
46
48
|
justify-content: center;
|
|
47
49
|
align-items: center;
|
|
48
|
-
min-height: 48px;
|
|
50
|
+
min-height: ${(0, _reactCore.RFValueStr)('48px')};
|
|
49
51
|
background-color: ${({
|
|
50
52
|
theme
|
|
51
53
|
}) => theme.color.primary.xlight};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/BottomNavigator/styled.ts"],"names":["StyledView","styled","View","theme","spacing","deca","kilo","miscellaneous","surfaceColor","TabContainer","Pressable","mili","selected","color","primary","medium","TabContent","xlight","borderRadius","CustomTabContent"],"mappings":";;;;;;;AAAA;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/atoms/BottomNavigator/styled.ts"],"names":["StyledView","styled","View","theme","spacing","deca","kilo","miscellaneous","surfaceColor","TabContainer","Pressable","mili","selected","color","primary","medium","TabContent","xlight","borderRadius","CustomTabContent"],"mappings":";;;;;;;AAAA;;AACA;;;;AAGO,MAAMA,UAAU,GAAGC,gBAAOC,IAAsC;AACvE;AACA;AACA,wBAAwB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,OAAN,CAAcC,IAAK;AAC1D,oBAAoB,CAAC;AAAEF,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,OAAN,CAAcE,IAAK;AACtD,sBAAsB,CAAC;AAAEH,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACI,aAAN,CAAoBC,YAAa;AACtE,CANO;;AAQA,MAAMC,YAAY,GAAGR,gBAAOS,SAEjC;AACF;AACA,uBAAuB,CAAC;AAAEP,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,OAAN,CAAcO,IAAK;AACzD,iBAAiB,CAAC;AAAER,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,OAAN,CAAcC,IAAK;AACnD,sBAAsB,CAAC;AAAEO,EAAAA;AAAF,CAAD,KAAmBA,QAAQ,GAAG,2BAAW,KAAX,CAAH,GAAuB,CAAG;AAC3E,kBAAkB,CAAC;AAAET,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACU,KAAN,CAAYC,OAAZ,CAAoBC,MAAO;AAC5D;AACA;AACA,CAVO;;AAYA,MAAMC,UAAU,GAAGf,gBAAOC,IAAsC;AACvE;AACA;AACA;AACA,gBAAgB,2BAAW,MAAX,CAAmB;AACnC,sBAAsB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACU,KAAN,CAAYC,OAAZ,CAAoBG,MAAO;AAChE,mBAAmB,CAAC;AAAEd,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACe,YAAN,CAAmB,MAAnB,CAA2B;AAC7D,CAPO;;AASA,MAAMC,gBAAgB,GAAGlB,gBAAOC,IAAsC,EAAtE","sourcesContent":["import styled from '@emotion/native';\nimport { RFValueStr, StyleProps } from '@tecsinapse/react-core';\nimport { PressableProps, ViewProps } from 'react-native';\n\nexport const StyledView = styled.View<ViewProps & Partial<StyleProps>>`\n flex-direction: row;\n justify-content: space-between;\n padding-horizontal: ${({ theme }) => theme.spacing.deca};\n padding-bottom: ${({ theme }) => theme.spacing.kilo};\n background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const TabContainer = styled.Pressable<\n { selected: boolean } & PressableProps & Partial<StyleProps>\n>`\n flex: 1;\n margin-horizontal: ${({ theme }) => theme.spacing.mili};\n padding-top: ${({ theme }) => theme.spacing.deca};\n border-top-width: ${({ selected }) => (selected ? RFValueStr('2px') : 0)};\n border-color: ${({ theme }) => theme.color.primary.medium};\n align-items: center;\n justify-content: flex-end;\n`;\n\nexport const TabContent = styled.View<ViewProps & Partial<StyleProps>>`\n aspect-ratio: 1;\n justify-content: center;\n align-items: center;\n min-height: ${RFValueStr('48px')};\n background-color: ${({ theme }) => theme.color.primary.xlight};\n border-radius: ${({ theme }) => theme.borderRadius['mili']};\n`;\n\nexport const CustomTabContent = styled.View<ViewProps & Partial<StyleProps>>``;\n"],"file":"styled.js"}
|
|
@@ -14,7 +14,7 @@ var _styled = require("../Text/styled");
|
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
|
|
16
16
|
const StyledInputContainer = (0, _native.default)(_reactCore.InputContainer)`
|
|
17
|
-
min-height: 50px;
|
|
17
|
+
min-height: ${(0, _reactCore.RFValueStr)('50px')};
|
|
18
18
|
`;
|
|
19
19
|
exports.StyledInputContainer = StyledInputContainer;
|
|
20
20
|
const StyledNativeInputBase = (0, _native.default)(_reactCore.InputElement)`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/Input/styled.ts"],"names":["StyledInputContainer","InputContainer","StyledNativeInputBase","InputElement","theme","typography","h5","lineHeight","StyledNativeInput","fontStyles"],"mappings":";;;;;;;AAAA;;AACA;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/atoms/Input/styled.ts"],"names":["StyledInputContainer","InputContainer","StyledNativeInputBase","InputElement","theme","typography","h5","lineHeight","StyledNativeInput","fontStyles"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;AAGO,MAAMA,oBAAoB,GAAG,qBAAOC,yBAAP,CAA4C;AAChF,gBAAgB,2BAAW,MAAX,CAAmB;AACnC,CAFO;;AAIP,MAAMC,qBAAqB,GAAG,qBAAOC,uBAAP,CAE5B;AACF,YAAY,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,UAAN,CAAiBC,EAAjB,CAAoBC,UAAW;AAC1D;AACA;AACA,CANA;AAQO,MAAMC,iBAAiB,GAAG,qBAAON,qBAAP,EAE/BO,kBAF+B,CAA1B","sourcesContent":["import styled from '@emotion/native';\nimport {\n InputContainer,\n InputElement,\n RFValueStr,\n StyleProps\n} from '@tecsinapse/react-core';\nimport { Font, fontStyles } from '../Text/styled';\nimport { InputNativeProps } from './Input';\n\nexport const StyledInputContainer = styled(InputContainer)<Partial<StyleProps>>`\n min-height: ${RFValueStr('50px')};\n`;\n\nconst StyledNativeInputBase = styled(InputElement)<\n Partial<InputNativeProps> & Partial<StyleProps>\n>`\n height: ${({ theme }) => theme.typography.h5.lineHeight};\n width: 100%;\n padding: 0;\n`;\n\nexport const StyledNativeInput = styled(StyledNativeInputBase)<\n Font & Partial<InputNativeProps> & Partial<StyleProps>\n>(fontStyles);\n"],"file":"styled.js"}
|
|
@@ -7,6 +7,8 @@ exports.CloseBar = exports.BackDropView = exports.StyledPressableBackDrop = void
|
|
|
7
7
|
|
|
8
8
|
var _native = _interopRequireDefault(require("@emotion/native"));
|
|
9
9
|
|
|
10
|
+
var _reactCore = require("@tecsinapse/react-core");
|
|
11
|
+
|
|
10
12
|
var _reactNative = require("react-native");
|
|
11
13
|
|
|
12
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -27,10 +29,10 @@ const CloseBar = _native.default.View`
|
|
|
27
29
|
background-color: ${({
|
|
28
30
|
theme
|
|
29
31
|
}) => theme.color.secondary.light};
|
|
30
|
-
border-radius: 10px;
|
|
31
|
-
margin: 5px auto;
|
|
32
|
-
width: 42px;
|
|
33
|
-
height: 5px;
|
|
32
|
+
border-radius: ${(0, _reactCore.RFValueStr)('10px')};
|
|
33
|
+
margin: ${`${(0, _reactCore.RFValueStr)('5px')} auto`};
|
|
34
|
+
width: ${(0, _reactCore.RFValueStr)('42px')};
|
|
35
|
+
height: ${(0, _reactCore.RFValueStr)('5px')};
|
|
34
36
|
`;
|
|
35
37
|
exports.CloseBar = CloseBar;
|
|
36
38
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/atoms/Modal/ui/styled.ts"],"names":["StyledPressableBackDrop","styled","Pressable","BackDropView","Animated","View","CloseBar","theme","color","secondary","light"],"mappings":";;;;;;;AAAA;;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/atoms/Modal/ui/styled.ts"],"names":["StyledPressableBackDrop","styled","Pressable","BackDropView","Animated","View","CloseBar","theme","color","secondary","light"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAEO,MAAMA,uBAAuB,GAAGC,gBAAOC,SAA+B;AAC7E;AACA;AACA;AACA;AACA,CALO;;AAOA,MAAMC,YAAY,GAAG,qBAAOC,sBAASC,IAAhB,CAA2C;AACvE;AACA;AACA,CAHO;;AAKA,MAAMC,QAAQ,GAAGL,gBAAOI,IAA0B;AACzD,wBAAwB,CAAC;AAAEE,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,KAAN,CAAYC,SAAZ,CAAsBC,KAAM;AACnE,qBAAqB,2BAAW,MAAX,CAAmB;AACxC,cAAe,GAAE,2BAAW,KAAX,CAAkB,OAAO;AAC1C,aAAa,2BAAW,MAAX,CAAmB;AAChC,cAAc,2BAAW,KAAX,CAAkB;AAChC,CANO","sourcesContent":["import styled from \"@emotion/native\";\nimport { RFValueStr, StyleProps } from \"@tecsinapse/react-core\";\nimport { Animated } from \"react-native\";\n\nexport const StyledPressableBackDrop = styled.Pressable<Partial<StyleProps>>`\n flex: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n`\n\nexport const BackDropView = styled(Animated.View)<Partial<StyleProps>>`\n justify-content: flex-end;\n flex: 1;\n`\n\nexport const CloseBar = styled.View<Partial<StyleProps>>`\n background-color: ${({ theme }) => theme.color.secondary.light};\n border-radius: ${RFValueStr('10px')};\n margin: ${`${RFValueStr('5px')} auto`};\n width: ${RFValueStr('42px')};\n height: ${RFValueStr('5px')};\n`"],"file":"styled.js"}
|
|
@@ -56,7 +56,7 @@ const Header = (0, _native.default)(_reactNative.View)`
|
|
|
56
56
|
padding: ${({
|
|
57
57
|
theme
|
|
58
58
|
}) => theme.spacing.deca};
|
|
59
|
-
height: 75px;
|
|
59
|
+
height: ${(0, _reactCore.RFValueStr)('75px')};
|
|
60
60
|
`;
|
|
61
61
|
exports.Header = Header;
|
|
62
62
|
const CloseButton = (0, _native.default)(_reactCore.Button)`
|
|
@@ -78,7 +78,7 @@ const SearchBar = (0, _native.default)(_Input.Input)`
|
|
|
78
78
|
`;
|
|
79
79
|
exports.SearchBar = SearchBar;
|
|
80
80
|
const ListItem = (0, _native.default)(_reactCore.PressableSurface)`
|
|
81
|
-
border-bottom-width: 1px;
|
|
81
|
+
border-bottom-width: ${(0, _reactCore.RFValueStr)('1px')};
|
|
82
82
|
border-color: ${({
|
|
83
83
|
theme
|
|
84
84
|
}) => theme.color.secondary.light};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/Select/styled.ts"],"names":["StyledModal","View","theme","miscellaneous","bodyColor","StyledSelectionText","Text","props","typography","h5","lineHeight","Dummy","StyledPressableSurface","PressableSurface","Header","spacing","deca","CloseButton","Button","SearchBarContainer","SearchBar","Input","ListItem","color","secondary","light","mili","ModalFooter","SelectIcon","Icon","centi","medium","FetchIndicator","ActivityIndicator"],"mappings":";;;;;;;AAAA;;AACA;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/atoms/Select/styled.ts"],"names":["StyledModal","View","theme","miscellaneous","bodyColor","StyledSelectionText","Text","props","typography","h5","lineHeight","Dummy","StyledPressableSurface","PressableSurface","Header","spacing","deca","CloseButton","Button","SearchBarContainer","SearchBar","Input","ListItem","color","secondary","light","mili","ModalFooter","SelectIcon","Icon","centi","medium","FetchIndicator","ActivityIndicator"],"mappings":";;;;;;;AAAA;;AACA;;AAWA;;AACA;;AACA;;;;;;AAEO,MAAMA,WAAW,GAAG,qBAAOC,iBAAP,CAA+C;AAC1E;AACA,sBAAsB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,aAAN,CAAoBC,SAAU;AACnE;AACA;AACA,CALO;;AAOA,MAAMC,mBAAmB,GAAG,qBAAOC,UAAP,EAChCC,KAAD;AAAA;;AAAA,SAA+D,gBAAI;AACrE,mBADoE,gBACjDA,KAAK,CAACL,KAD2C,iDACjD,aAAaM,UAAb,CAAwBC,EAAxB,CAA2BC,UAAW;AACzD,MAAM,oCAAoBH,KAApB,CAA2B;AACjC,GAHE;AAAA,CADiC,CAA5B;;AAOA,MAAMI,KAAK,GAAG,qBAAOV,iBAAP,CAAa;AAClC;AACA;AACA,CAHO;;AAKA,MAAMW,sBAAsB,GAAG,qBACpCC,2BADoC,CAEb;AACzB;AACA,CAJO;;AAMA,MAAMC,MAAM,GAAG,qBAAOb,iBAAP,CAA8C;AACpE;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C,YAAY,2BAAW,MAAX,CAAmB;AAC/B,CATO;;AAWA,MAAMC,WAAW,GAAG,qBAAOC,iBAAP,CAAkD;AAC7E;AACA;AACA,CAHO;;AAKA,MAAMC,kBAAkB,GAAG,qBAAOlB,iBAAP,CAA8C;AAChF,aAAa,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C;AACA,CAHO;;AAKA,MAAMI,SAAS,GAAG,qBAAOC,YAAP,CAAsD;AAC/E,mBAAmB,CAAC;AAAEnB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AACrD,CAFO;;AAIA,MAAMM,QAAQ,GAAG,qBAAOT,2BAAP,CAEtB;AACF,yBAAyB,2BAAW,KAAX,CAAkB;AAC3C,kBAAkB,CAAC;AAAEX,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACqB,KAAN,CAAYC,SAAZ,CAAsBC,KAAM;AAC7D,sBAAsB,CAAC;AAAEvB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcW,IAAK;AACxD,wBAAwB,CAAC;AAAExB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC1D,CAPO;;AASA,MAAMW,WAAW,GAAG,qBAAO1B,iBAAP,CAAkC;AAC7D;AACA;AACA;AACA,sBAAsB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,aAAN,CAAoBC,SAAU;AACnE,aAAa,CAAC;AAAEF,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C,CANO;;AAQA,MAAMY,UAAU,GAAG,qBAAOC,eAAP,CAAkC;AAC5D,aAAa,CAAC;AAAE3B,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAce,KAAM;AAChD,WAAW,CAAC;AAAE5B,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACqB,KAAN,CAAYC,SAAZ,CAAsBO,MAAO;AACvD,CAHO;;AAKA,MAAMC,cAAc,GAAG,qBAAOC,8BAAP,CAA0B;AACxD;AACA,CAFO","sourcesContent":["import styled, { css } from '@emotion/native';\nimport {\n Button,\n ButtonProps,\n disabledInputStyles,\n Icon,\n InputContainerProps,\n PressableSurface,\n PressableSurfaceProps,\n RFValueStr,\n StyleProps\n} from '@tecsinapse/react-core';\nimport { ActivityIndicator, ModalProps, View, ViewProps } from 'react-native';\nimport { Input, InputNativeProps } from '../Input';\nimport { Text } from '../Text';\n\nexport const StyledModal = styled(View)<ModalProps & Partial<StyleProps>>`\n position: relative;\n background-color: ${({ theme }) => theme.miscellaneous.bodyColor};\n height: 100%;\n width: 100%;\n`;\n\nexport const StyledSelectionText = styled(Text)(\n (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n line-height: ${props.theme?.typography.h5.lineHeight};\n ${disabledInputStyles(props)};\n `\n);\n\nexport const Dummy = styled(View)`\n aspect-ratio: 1;\n height: 100%;\n`;\n\nexport const StyledPressableSurface = styled(\n PressableSurface\n)<PressableSurfaceProps>`\n width: 100%;\n`;\n\nexport const Header = styled(View)<ViewProps & Partial<StyleProps>>`\n position: relative;\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: ${({ theme }) => theme.spacing.deca};\n height: ${RFValueStr('75px')};\n`;\n\nexport const CloseButton = styled(Button)<ButtonProps & Partial<StyleProps>>`\n aspect-ratio: 1;\n height: 100%;\n`;\n\nexport const SearchBarContainer = styled(View)<ViewProps & Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.deca};\n position: relative;\n`;\n\nexport const SearchBar = styled(Input)<InputNativeProps & Partial<StyleProps>>`\n margin-bottom: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const ListItem = styled(PressableSurface)<\n PressableSurfaceProps & Partial<StyleProps>\n>`\n border-bottom-width: ${RFValueStr('1px')};\n border-color: ${({ theme }) => theme.color.secondary.light};\n padding-vertical: ${({ theme }) => theme.spacing.mili};\n padding-horizontal: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const ModalFooter = styled(View)<Partial<StyleProps>>`\n width: 100%;\n height: auto;\n bottom: 0;\n background-color: ${({ theme }) => theme.miscellaneous.bodyColor};\n padding: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const SelectIcon = styled(Icon)<Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.centi};\n color: ${({ theme }) => theme.color.secondary.medium};\n`;\n\nexport const FetchIndicator = styled(ActivityIndicator)`\n align-self: center;\n`;\n"],"file":"styled.js"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/react-native-kit",
|
|
3
3
|
"description": "TecSinapse React Native components",
|
|
4
|
-
"version": "1.12.
|
|
4
|
+
"version": "1.12.11",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"license": "MIT",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"@emotion/native": "^11.0.0",
|
|
15
15
|
"@emotion/react": "^11.4.1",
|
|
16
|
-
"@tecsinapse/react-core": "^1.12.
|
|
16
|
+
"@tecsinapse/react-core": "^1.12.8"
|
|
17
17
|
},
|
|
18
18
|
"repository": {
|
|
19
19
|
"type": "git",
|
|
@@ -34,5 +34,5 @@
|
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@types/uuid": "^8.3.3"
|
|
36
36
|
},
|
|
37
|
-
"gitHead": "
|
|
37
|
+
"gitHead": "5ae217bb1d1226eb9d83e1b7d7630ccc177df104"
|
|
38
38
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import styled from '@emotion/native';
|
|
2
|
-
import { StyleProps } from '@tecsinapse/react-core';
|
|
2
|
+
import { RFValueStr, StyleProps } from '@tecsinapse/react-core';
|
|
3
3
|
import { PressableProps, ViewProps } from 'react-native';
|
|
4
4
|
|
|
5
5
|
export const StyledView = styled.View<ViewProps & Partial<StyleProps>>`
|
|
@@ -16,7 +16,7 @@ export const TabContainer = styled.Pressable<
|
|
|
16
16
|
flex: 1;
|
|
17
17
|
margin-horizontal: ${({ theme }) => theme.spacing.mili};
|
|
18
18
|
padding-top: ${({ theme }) => theme.spacing.deca};
|
|
19
|
-
border-top-width: ${({ selected }) => (selected ? '2px' : 0)};
|
|
19
|
+
border-top-width: ${({ selected }) => (selected ? RFValueStr('2px') : 0)};
|
|
20
20
|
border-color: ${({ theme }) => theme.color.primary.medium};
|
|
21
21
|
align-items: center;
|
|
22
22
|
justify-content: flex-end;
|
|
@@ -26,7 +26,7 @@ export const TabContent = styled.View<ViewProps & Partial<StyleProps>>`
|
|
|
26
26
|
aspect-ratio: 1;
|
|
27
27
|
justify-content: center;
|
|
28
28
|
align-items: center;
|
|
29
|
-
min-height: 48px;
|
|
29
|
+
min-height: ${RFValueStr('48px')};
|
|
30
30
|
background-color: ${({ theme }) => theme.color.primary.xlight};
|
|
31
31
|
border-radius: ${({ theme }) => theme.borderRadius['mili']};
|
|
32
32
|
`;
|
|
@@ -2,13 +2,14 @@ import styled from '@emotion/native';
|
|
|
2
2
|
import {
|
|
3
3
|
InputContainer,
|
|
4
4
|
InputElement,
|
|
5
|
-
|
|
5
|
+
RFValueStr,
|
|
6
|
+
StyleProps
|
|
6
7
|
} from '@tecsinapse/react-core';
|
|
7
8
|
import { Font, fontStyles } from '../Text/styled';
|
|
8
9
|
import { InputNativeProps } from './Input';
|
|
9
10
|
|
|
10
11
|
export const StyledInputContainer = styled(InputContainer)<Partial<StyleProps>>`
|
|
11
|
-
min-height: 50px;
|
|
12
|
+
min-height: ${RFValueStr('50px')};
|
|
12
13
|
`;
|
|
13
14
|
|
|
14
15
|
const StyledNativeInputBase = styled(InputElement)<
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import styled from "@emotion/native";
|
|
2
|
-
import { StyleProps } from "@tecsinapse/react-core";
|
|
2
|
+
import { RFValueStr, StyleProps } from "@tecsinapse/react-core";
|
|
3
3
|
import { Animated } from "react-native";
|
|
4
4
|
|
|
5
5
|
export const StyledPressableBackDrop = styled.Pressable<Partial<StyleProps>>`
|
|
@@ -16,8 +16,8 @@ export const BackDropView = styled(Animated.View)<Partial<StyleProps>>`
|
|
|
16
16
|
|
|
17
17
|
export const CloseBar = styled.View<Partial<StyleProps>>`
|
|
18
18
|
background-color: ${({ theme }) => theme.color.secondary.light};
|
|
19
|
-
border-radius: 10px;
|
|
20
|
-
margin: 5px auto;
|
|
21
|
-
width: 42px;
|
|
22
|
-
height: 5px;
|
|
19
|
+
border-radius: ${RFValueStr('10px')};
|
|
20
|
+
margin: ${`${RFValueStr('5px')} auto`};
|
|
21
|
+
width: ${RFValueStr('42px')};
|
|
22
|
+
height: ${RFValueStr('5px')};
|
|
23
23
|
`
|
|
@@ -7,7 +7,8 @@ import {
|
|
|
7
7
|
InputContainerProps,
|
|
8
8
|
PressableSurface,
|
|
9
9
|
PressableSurfaceProps,
|
|
10
|
-
|
|
10
|
+
RFValueStr,
|
|
11
|
+
StyleProps
|
|
11
12
|
} from '@tecsinapse/react-core';
|
|
12
13
|
import { ActivityIndicator, ModalProps, View, ViewProps } from 'react-native';
|
|
13
14
|
import { Input, InputNativeProps } from '../Input';
|
|
@@ -46,7 +47,7 @@ export const Header = styled(View)<ViewProps & Partial<StyleProps>>`
|
|
|
46
47
|
align-items: center;
|
|
47
48
|
justify-content: space-between;
|
|
48
49
|
padding: ${({ theme }) => theme.spacing.deca};
|
|
49
|
-
height: 75px;
|
|
50
|
+
height: ${RFValueStr('75px')};
|
|
50
51
|
`;
|
|
51
52
|
|
|
52
53
|
export const CloseButton = styled(Button)<ButtonProps & Partial<StyleProps>>`
|
|
@@ -66,7 +67,7 @@ export const SearchBar = styled(Input)<InputNativeProps & Partial<StyleProps>>`
|
|
|
66
67
|
export const ListItem = styled(PressableSurface)<
|
|
67
68
|
PressableSurfaceProps & Partial<StyleProps>
|
|
68
69
|
>`
|
|
69
|
-
border-bottom-width: 1px;
|
|
70
|
+
border-bottom-width: ${RFValueStr('1px')};
|
|
70
71
|
border-color: ${({ theme }) => theme.color.secondary.light};
|
|
71
72
|
padding-vertical: ${({ theme }) => theme.spacing.mili};
|
|
72
73
|
padding-horizontal: ${({ theme }) => theme.spacing.deca};
|