@herca/rn-kit 0.1.6 → 0.1.7

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/README.md CHANGED
@@ -70,6 +70,19 @@ cd ios
70
70
  pod install
71
71
  ```
72
72
 
73
+ Wrap content utama dengan Provider
74
+
75
+ ```tsx
76
+
77
+ import {Provider} from '@herca/rn-kit';
78
+ const Stack = createNativeStackNavigator();
79
+
80
+ const App = () => {
81
+ return (
82
+ <Provider>
83
+ <YoyrCode>
84
+ </Provider>
85
+ ```
73
86
  ---
74
87
 
75
88
  ## 🚀 Penggunaan
@@ -88,13 +101,17 @@ import { Button } from '@herca/rn-kit';
88
101
 
89
102
  Komponen untuk mengumpulkan input dari pengguna.
90
103
 
104
+ - [Button](./src/Button/README.md)
91
105
  - [Checkbox](./src/Checkbox/README_CHECKBOX.md)
92
106
  - [Checkbox](./src/Checkbox/README_CHECKBOXLIST.md)
93
107
  - [Chip-(Select)](./src/Chip/README.md)
94
108
  - [DatePicker](./src/DatePicker/README.md)
95
109
  - [DropDown](./src/DropDown/README.md)
96
110
  - [Input](./src/Input/README.md)
111
+ - [Input Month](./src/InputMonth/README.md)
97
112
  - [Input Password](./src/InputPassword/README.md)
113
+ - [Input Time](./src/InputTime/README.md)
114
+ - [Input Year](./src/InputYear/README.md)
98
115
  - [Radio Button](./src/RadioButton/README.md)
99
116
  - [Select](./src/Select/README.md)
100
117
  - [Switch](./src/Switch/README.md)
@@ -140,12 +157,17 @@ Komponen untuk menampilkan informasi atau elemen visual.
140
157
  - [Color](./src/Color/README.md)
141
158
  - [Card](./src/Ui/README_CARD.md)
142
159
  - [Drawing](./src/Drawing/README.md)
160
+ - [Footer](./src/Footer/README.md)
143
161
  - [List](./src/List/README.md)
144
162
  - [Timeline](./src/Timeline/README.md)
145
163
  - [Typography](./src/Typography/README.md)
146
164
 
147
165
  ---
148
166
 
167
+ ### Contex
168
+
169
+ - [Provider](./src/Provider/README.md)
170
+
149
171
  ## 🤝 Kontribusi
150
172
 
151
173
  Silakan baca panduan kontribusi pada [CONTRIBUTING.md](CONTRIBUTING.md) untuk mengetahui alur pengembangan dan kontribusi pada proyek ini.
@@ -1,9 +1,9 @@
1
1
  "use strict";
2
2
 
3
3
  import { useState, useRef } from 'react';
4
- import { View, Text, TouchableOpacity, StyleSheet, ScrollView, useWindowDimensions, findNodeHandle, UIManager } from 'react-native';
4
+ import { View, Text, TouchableOpacity, Pressable, StyleSheet, ScrollView, useWindowDimensions, findNodeHandle, UIManager, Modal } from 'react-native';
5
5
  import Color from "../Color/Color.js";
6
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
6
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
7
7
  const Dropdown = ({
8
8
  options,
9
9
  maxHeight = 200,
@@ -12,16 +12,28 @@ const Dropdown = ({
12
12
  }) => {
13
13
  const [isOpen, setIsOpen] = useState(false);
14
14
  const [selected, setSelected] = useState();
15
- const [dropdownPosition, setDropdownPosition] = useState('left');
15
+ const [align, setAlign] = useState('left');
16
+ const [buttonLayout, setButtonLayout] = useState({
17
+ x: 0,
18
+ y: 0,
19
+ width: 0,
20
+ height: 0
21
+ });
16
22
  const buttonRef = useRef(null);
17
23
  const windowWidth = useWindowDimensions().width;
18
24
  const handleToggle = () => {
19
25
  if (!isOpen) {
20
26
  const handle = findNodeHandle(buttonRef.current);
21
27
  if (handle) {
22
- UIManager.measureInWindow(handle, (x, _y, width, _height) => {
28
+ UIManager.measureInWindow(handle, (x, y, width, height) => {
23
29
  const middle = windowWidth / 2;
24
- setDropdownPosition(x + width / 2 > middle ? 'right' : 'left');
30
+ setAlign(x + width / 2 > middle ? 'right' : 'left');
31
+ setButtonLayout({
32
+ x,
33
+ y,
34
+ width,
35
+ height
36
+ });
25
37
  setIsOpen(true);
26
38
  });
27
39
  }
@@ -34,56 +46,54 @@ const Dropdown = ({
34
46
  setIsOpen(false);
35
47
  onSelect?.(value.value);
36
48
  };
37
- return /*#__PURE__*/_jsxs(View, {
38
- style: styles.container,
49
+ return /*#__PURE__*/_jsxs(_Fragment, {
39
50
  children: [/*#__PURE__*/_jsx(TouchableOpacity, {
40
51
  ref: buttonRef,
41
- style: styles.dropdownButton,
42
52
  onPress: handleToggle,
43
- children: renderButton ? renderButton : /*#__PURE__*/_jsx(Text, {
44
- children: selected || 'Select an option'
45
- })
46
- }), isOpen && /*#__PURE__*/_jsx(View, {
47
- style: [styles.dropdownList, dropdownPosition === 'left' ? styles.left : styles.right],
48
- children: /*#__PURE__*/_jsx(ScrollView, {
49
- nestedScrollEnabled: true,
50
- style: {
51
- maxHeight
52
- },
53
- children: options.map((item, index) => /*#__PURE__*/_jsx(TouchableOpacity, {
54
- onPress: () => handlePressOption(item),
55
- style: [styles.option, selected === item.value ? styles.optionSelected : null],
56
- children: /*#__PURE__*/_jsx(Text, {
57
- children: item.label
58
- })
59
- }, index))
60
- })
53
+ children: renderButton
54
+ }), isOpen && /*#__PURE__*/_jsxs(Modal, {
55
+ transparent: true,
56
+ animationType: "none",
57
+ visible: true,
58
+ children: [/*#__PURE__*/_jsx(Pressable, {
59
+ style: StyleSheet.absoluteFillObject,
60
+ onPress: () => setIsOpen(false)
61
+ }), /*#__PURE__*/_jsx(View, {
62
+ style: [styles.dropdownList, {
63
+ top: buttonLayout.y + buttonLayout.height,
64
+ left: align === 'left' ? buttonLayout.x : undefined,
65
+ right: align === 'right' ? windowWidth - (buttonLayout.x + buttonLayout.width) : undefined
66
+ }],
67
+ children: /*#__PURE__*/_jsx(ScrollView, {
68
+ nestedScrollEnabled: true,
69
+ style: {
70
+ maxHeight
71
+ },
72
+ children: options.map((item, idx) => /*#__PURE__*/_jsx(TouchableOpacity, {
73
+ onPress: () => handlePressOption(item),
74
+ style: [styles.option, selected === item.value && styles.optionSelected],
75
+ children: /*#__PURE__*/_jsx(Text, {
76
+ children: item.label
77
+ })
78
+ }, idx))
79
+ })
80
+ })]
61
81
  })]
62
82
  });
63
83
  };
64
84
  export default Dropdown;
65
85
  const styles = StyleSheet.create({
66
- container: {
67
- // width: 200, // or flexible
68
- },
69
- dropdownButton: {
70
- // borderWidth: 1,
71
- // borderColor: '#ccc',
72
- // padding: 12,
73
- // borderRadius: 6,
74
- // backgroundColor: '#fff',
75
- },
86
+ button: {},
76
87
  dropdownList: {
77
88
  position: 'absolute',
78
- marginTop: 18,
79
89
  padding: 8,
80
- zIndex: 9999,
90
+ zIndex: 10,
81
91
  gap: 4,
82
92
  borderWidth: 1,
83
93
  borderColor: Color.gray[50],
84
94
  borderRadius: 8,
85
95
  backgroundColor: Color.base.white100,
86
- width: 100
96
+ width: 120
87
97
  },
88
98
  option: {
89
99
  gap: 8,
@@ -96,12 +106,6 @@ const styles = StyleSheet.create({
96
106
  optionSelected: {
97
107
  backgroundColor: Color.primary[50],
98
108
  borderColor: Color.primary[300]
99
- },
100
- left: {
101
- left: 0
102
- },
103
- right: {
104
- right: 0
105
109
  }
106
110
  });
107
111
  //# sourceMappingURL=DropDown.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["useState","useRef","View","Text","TouchableOpacity","StyleSheet","ScrollView","useWindowDimensions","findNodeHandle","UIManager","Color","jsx","_jsx","jsxs","_jsxs","Dropdown","options","maxHeight","onSelect","renderButton","isOpen","setIsOpen","selected","setSelected","dropdownPosition","setDropdownPosition","buttonRef","windowWidth","width","handleToggle","handle","current","measureInWindow","x","_y","_height","middle","handlePressOption","value","style","styles","container","children","ref","dropdownButton","onPress","dropdownList","left","right","nestedScrollEnabled","map","item","index","option","optionSelected","label","create","position","marginTop","padding","zIndex","gap","borderWidth","borderColor","gray","borderRadius","backgroundColor","base","white100","paddingVertical","paddingHorizontal","primary"],"sourceRoot":"../../../src","sources":["DropDown/DropDown.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["useState","useRef","View","Text","TouchableOpacity","Pressable","StyleSheet","ScrollView","useWindowDimensions","findNodeHandle","UIManager","Modal","Color","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Dropdown","options","maxHeight","onSelect","renderButton","isOpen","setIsOpen","selected","setSelected","align","setAlign","buttonLayout","setButtonLayout","x","y","width","height","buttonRef","windowWidth","handleToggle","handle","current","measureInWindow","middle","handlePressOption","value","children","ref","onPress","transparent","animationType","visible","style","absoluteFillObject","styles","dropdownList","top","left","undefined","right","nestedScrollEnabled","map","item","idx","option","optionSelected","label","create","button","position","padding","zIndex","gap","borderWidth","borderColor","gray","borderRadius","backgroundColor","base","white100","paddingVertical","paddingHorizontal","primary"],"sourceRoot":"../../../src","sources":["DropDown/DropDown.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1 @@
1
+ # Dropdown
@@ -5,6 +5,7 @@ import { createContext, useContext, useState } from 'react';
5
5
  import { StyleSheet, View } from 'react-native';
6
6
  import LayoutWithFooter from "./LayoutWithFooter.js";
7
7
  import RequiredUpdateAppsProvider from "./RequiredUpdateAppsProvider.js";
8
+ import Color from "../Color/Color.js";
8
9
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
9
10
  const FooterContext = /*#__PURE__*/createContext(undefined);
10
11
  export default function Provider({
@@ -37,6 +38,7 @@ export const useFooter = () => {
37
38
  };
38
39
  const styles = StyleSheet.create({
39
40
  container: {
41
+ backgroundColor: Color.base.white100,
40
42
  flex: 1
41
43
  }
42
44
  });
@@ -1 +1 @@
1
- {"version":3,"names":["createContext","useContext","useState","StyleSheet","View","LayoutWithFooter","RequiredUpdateAppsProvider","jsx","_jsx","jsxs","_jsxs","FooterContext","undefined","Provider","children","requiredUpdated","updateConfig","footer","setFooter","style","styles","container","value","useFooter","context","Error","create","flex"],"sourceRoot":"../../../src","sources":["Provider/Provider.tsx"],"mappings":";;AAAA;AACA,SAASA,aAAa,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,OAAO;AAC3D,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,OAAOC,gBAAgB,MAAM,uBAAoB;AACjD,OAAOC,0BAA0B,MAAM,iCAA8B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAetE,MAAMC,aAAa,gBAAGX,aAAa,CAAgCY,SAAS,CAAC;AAE7E,eAAe,SAASC,QAAQA,CAAC;EAC/BC,QAAQ;EACRC,eAAe,GAAG,KAAK;EACvBC;AACa,CAAC,EAAE;EAChB,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGhB,QAAQ,CAAC,IAAI,CAAC;EAE1C,oBACEQ,KAAA,CAACN,IAAI;IAACe,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAP,QAAA,GAC3BC,eAAe,gBACdP,IAAA,CAACF,0BAA0B;MAAA,GAAKU;IAAY,CAAG,CAAC,GAC9C,IAAI,eACRR,IAAA,CAACG,aAAa,CAACE,QAAQ;MAACS,KAAK,EAAE;QAAEL,MAAM;QAAEC;MAAU,CAAE;MAAAJ,QAAA,eACnDN,IAAA,CAACH,gBAAgB;QAAAS,QAAA,EAAEA;MAAQ,CAAmB;IAAC,CACzB,CAAC;EAAA,CACrB,CAAC;AAEX;AAEA,OAAO,MAAMS,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,OAAO,GAAGvB,UAAU,CAACU,aAAa,CAAC;EACzC,IAAIa,OAAO,KAAKZ,SAAS,EAAE;IACzB,MAAM,IAAIa,KAAK,CAAC,iDAAiD,CAAC;EACpE;EACA,OAAOD,OAAO;AAChB,CAAC;AAED,MAAMJ,MAAM,GAAGjB,UAAU,CAACuB,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["createContext","useContext","useState","StyleSheet","View","LayoutWithFooter","RequiredUpdateAppsProvider","Color","jsx","_jsx","jsxs","_jsxs","FooterContext","undefined","Provider","children","requiredUpdated","updateConfig","footer","setFooter","style","styles","container","value","useFooter","context","Error","create","backgroundColor","base","white100","flex"],"sourceRoot":"../../../src","sources":["Provider/Provider.tsx"],"mappings":";;AAAA;AACA,SAASA,aAAa,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,OAAO;AAC3D,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,OAAOC,gBAAgB,MAAM,uBAAoB;AACjD,OAAOC,0BAA0B,MAAM,iCAA8B;AAGrE,OAAOC,KAAK,MAAM,mBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAanC,MAAMC,aAAa,gBAAGZ,aAAa,CAAgCa,SAAS,CAAC;AAE7E,eAAe,SAASC,QAAQA,CAAC;EAC/BC,QAAQ;EACRC,eAAe,GAAG,KAAK;EACvBC;AACa,CAAC,EAAE;EAChB,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGjB,QAAQ,CAAC,IAAI,CAAC;EAE1C,oBACES,KAAA,CAACP,IAAI;IAACgB,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAP,QAAA,GAC3BC,eAAe,gBACdP,IAAA,CAACH,0BAA0B;MAAA,GAAKW;IAAY,CAAG,CAAC,GAC9C,IAAI,eACRR,IAAA,CAACG,aAAa,CAACE,QAAQ;MAACS,KAAK,EAAE;QAAEL,MAAM;QAAEC;MAAU,CAAE;MAAAJ,QAAA,eACnDN,IAAA,CAACJ,gBAAgB;QAAAU,QAAA,EAAEA;MAAQ,CAAmB;IAAC,CACzB,CAAC;EAAA,CACrB,CAAC;AAEX;AAEA,OAAO,MAAMS,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,OAAO,GAAGxB,UAAU,CAACW,aAAa,CAAC;EACzC,IAAIa,OAAO,KAAKZ,SAAS,EAAE;IACzB,MAAM,IAAIa,KAAK,CAAC,iDAAiD,CAAC;EACpE;EACA,OAAOD,OAAO;AAChB,CAAC;AAED,MAAMJ,MAAM,GAAGlB,UAAU,CAACwB,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,eAAe,EAAErB,KAAK,CAACsB,IAAI,CAACC,QAAQ;IACpCC,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
@@ -1,12 +1,18 @@
1
1
  "use strict";
2
2
 
3
- import { View } from 'react-native';
3
+ import { StyleSheet, View } from 'react-native';
4
4
  import { jsx as _jsx } from "react/jsx-runtime";
5
5
  export default function Timeline({
6
6
  children
7
7
  }) {
8
8
  return /*#__PURE__*/_jsx(View, {
9
+ style: styles.gap14,
9
10
  children: children
10
11
  });
11
12
  }
13
+ const styles = StyleSheet.create({
14
+ gap14: {
15
+ gap: 14
16
+ }
17
+ });
12
18
  //# sourceMappingURL=Timeline.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["View","jsx","_jsx","Timeline","children"],"sourceRoot":"../../../src","sources":["Timeline/Timeline.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMpC,eAAe,SAASC,QAAQA,CAAC;EAAEC;AAAmB,CAAC,EAAE;EACvD,oBAAOF,IAAA,CAACF,IAAI;IAAAI,QAAA,EAAEA;EAAQ,CAAO,CAAC;AAChC","ignoreList":[]}
1
+ {"version":3,"names":["StyleSheet","View","jsx","_jsx","Timeline","children","style","styles","gap14","create","gap"],"sourceRoot":"../../../src","sources":["Timeline/Timeline.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMhD,eAAe,SAASC,QAAQA,CAAC;EAAEC;AAAmB,CAAC,EAAE;EACvD,oBAAOF,IAAA,CAACF,IAAI;IAACK,KAAK,EAAEC,MAAM,CAACC,KAAM;IAAAH,QAAA,EAAEA;EAAQ,CAAO,CAAC;AACrD;AAEA,MAAME,MAAM,GAAGP,UAAU,CAACS,MAAM,CAAC;EAC/BD,KAAK,EAAE;IACLE,GAAG,EAAE;EACP;AACF,CAAC,CAAC","ignoreList":[]}
@@ -17,6 +17,18 @@ export default function TimelineItem({
17
17
  color = 'primary'
18
18
  }) {
19
19
  const [contentHeight, setContentHeight] = useState(0);
20
+ const renderDashes = count => {
21
+ return Array.from({
22
+ length: count
23
+ }).map((_, index) => /*#__PURE__*/_jsx(View, {
24
+ style: {
25
+ width: 1,
26
+ height: 4,
27
+ backgroundColor: Color.gray[400],
28
+ marginVertical: 2
29
+ }
30
+ }, index));
31
+ };
20
32
  return /*#__PURE__*/_jsxs(View, {
21
33
  style: styles.container,
22
34
  children: [/*#__PURE__*/_jsxs(View, {
@@ -25,9 +37,7 @@ export default function TimelineItem({
25
37
  name: "RadioButton",
26
38
  color: COLOR_MAP[color]
27
39
  }), /*#__PURE__*/_jsx(View, {
28
- style: [styles.border, {
29
- height: contentHeight - 20
30
- }]
40
+ children: renderDashes(Math.floor((contentHeight - 20) / 6))
31
41
  })]
32
42
  }), /*#__PURE__*/_jsx(View, {
33
43
  style: styles.flex,
@@ -54,10 +64,10 @@ const styles = StyleSheet.create({
54
64
  },
55
65
  border: {
56
66
  width: 1,
67
+ borderWidth: 1,
57
68
  borderLeftWidth: 1,
58
69
  borderLeftColor: Color.gray[400],
59
- borderStyle: 'dashed',
60
- marginTop: 4
70
+ borderStyle: 'dashed'
61
71
  },
62
72
  flex: {
63
73
  flex: 1
@@ -1 +1 @@
1
- {"version":3,"names":["useState","StyleSheet","View","Color","Icon","jsx","_jsx","jsxs","_jsxs","COLOR_MAP","warning","primary","success","purple","danger","TimelineItem","children","color","contentHeight","setContentHeight","style","styles","container","contentLeft","name","border","height","flex","onLayout","e","nativeEvent","layout","create","flexDirection","alignItems","marginRight","width","borderLeftWidth","borderLeftColor","gray","borderStyle","marginTop"],"sourceRoot":"../../../src","sources":["Timeline/TimelineItem.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAChC,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,OAAOC,KAAK,MAAM,mBAAgB;AAClC,SAASC,IAAI,QAAQ,kBAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/B,MAAMC,SAAS,GAAG;EAChBC,OAAO,EAAEP,KAAK,CAACO,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAER,KAAK,CAACQ,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAET,KAAK,CAACS,OAAO,CAAC,GAAG,CAAC;EAC3BC,MAAM,EAAEV,KAAK,CAACU,MAAM,CAAC,GAAG,CAAC;EACzBC,MAAM,EAAEX,KAAK,CAACW,MAAM,CAAC,GAAG;AAC1B,CAAC;AAQD,eAAe,SAASC,YAAYA,CAAC;EACnCC,QAAQ;EACRC,KAAK,GAAG;AACS,CAAC,EAAE;EACpB,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGnB,QAAQ,CAAC,CAAC,CAAC;EAErD,oBACEQ,KAAA,CAACN,IAAI;IAACkB,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAN,QAAA,gBAC5BR,KAAA,CAACN,IAAI;MAACkB,KAAK,EAAEC,MAAM,CAACE,WAAY;MAAAP,QAAA,gBAC9BV,IAAA,CAACF,IAAI;QAACoB,IAAI,EAAC,aAAa;QAACP,KAAK,EAAER,SAAS,CAACQ,KAAK;MAAE,CAAE,CAAC,eACpDX,IAAA,CAACJ,IAAI;QAACkB,KAAK,EAAE,CAACC,MAAM,CAACI,MAAM,EAAE;UAAEC,MAAM,EAAER,aAAa,GAAG;QAAG,CAAC;MAAE,CAAE,CAAC;IAAA,CAC5D,CAAC,eACPZ,IAAA,CAACJ,IAAI;MACHkB,KAAK,EAAEC,MAAM,CAACM,IAAK;MACnBC,QAAQ,EAAGC,CAAC,IAAK;QACf,MAAM;UAAEH;QAAO,CAAC,GAAGG,CAAC,CAACC,WAAW,CAACC,MAAM;QACvCZ,gBAAgB,CAACO,MAAM,CAAC;MAC1B,CAAE;MAAAV,QAAA,eAEFV,IAAA,CAACJ,IAAI;QAAAc,QAAA,EAAEA;MAAQ,CAAO;IAAC,CACnB,CAAC;EAAA,CACH,CAAC;AAEX;AACA,MAAMK,MAAM,GAAGpB,UAAU,CAAC+B,MAAM,CAAC;EAC/BV,SAAS,EAAE;IACTW,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDX,WAAW,EAAE;IACXW,UAAU,EAAE,QAAQ;IACpBC,WAAW,EAAE;EACf,CAAC;EACDV,MAAM,EAAE;IACNW,KAAK,EAAE,CAAC;IACRC,eAAe,EAAE,CAAC;IAClBC,eAAe,EAAEnC,KAAK,CAACoC,IAAI,CAAC,GAAG,CAAC;IAChCC,WAAW,EAAE,QAAQ;IACrBC,SAAS,EAAE;EACb,CAAC;EACDd,IAAI,EAAE;IACJA,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["useState","StyleSheet","View","Color","Icon","jsx","_jsx","jsxs","_jsxs","COLOR_MAP","warning","primary","success","purple","danger","TimelineItem","children","color","contentHeight","setContentHeight","renderDashes","count","Array","from","length","map","_","index","style","width","height","backgroundColor","gray","marginVertical","styles","container","contentLeft","name","Math","floor","flex","onLayout","e","nativeEvent","layout","create","flexDirection","alignItems","marginRight","border","borderWidth","borderLeftWidth","borderLeftColor","borderStyle"],"sourceRoot":"../../../src","sources":["Timeline/TimelineItem.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAChC,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,OAAOC,KAAK,MAAM,mBAAgB;AAClC,SAASC,IAAI,QAAQ,kBAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE/B,MAAMC,SAAS,GAAG;EAChBC,OAAO,EAAEP,KAAK,CAACO,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAER,KAAK,CAACQ,OAAO,CAAC,GAAG,CAAC;EAC3BC,OAAO,EAAET,KAAK,CAACS,OAAO,CAAC,GAAG,CAAC;EAC3BC,MAAM,EAAEV,KAAK,CAACU,MAAM,CAAC,GAAG,CAAC;EACzBC,MAAM,EAAEX,KAAK,CAACW,MAAM,CAAC,GAAG;AAC1B,CAAC;AAQD,eAAe,SAASC,YAAYA,CAAC;EACnCC,QAAQ;EACRC,KAAK,GAAG;AACS,CAAC,EAAE;EACpB,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGnB,QAAQ,CAAC,CAAC,CAAC;EACrD,MAAMoB,YAAY,GAAIC,KAAa,IAAK;IACtC,OAAOC,KAAK,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEH;IAAM,CAAC,CAAC,CAACI,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,kBAChDrB,IAAA,CAACJ,IAAI;MAEH0B,KAAK,EAAE;QACLC,KAAK,EAAE,CAAC;QACRC,MAAM,EAAE,CAAC;QACTC,eAAe,EAAE5B,KAAK,CAAC6B,IAAI,CAAC,GAAG,CAAC;QAChCC,cAAc,EAAE;MAClB;IAAE,GANGN,KAON,CACF,CAAC;EACJ,CAAC;EAED,oBACEnB,KAAA,CAACN,IAAI;IAAC0B,KAAK,EAAEM,MAAM,CAACC,SAAU;IAAAnB,QAAA,gBAC5BR,KAAA,CAACN,IAAI;MAAC0B,KAAK,EAAEM,MAAM,CAACE,WAAY;MAAApB,QAAA,gBAC9BV,IAAA,CAACF,IAAI;QAACiC,IAAI,EAAC,aAAa;QAACpB,KAAK,EAAER,SAAS,CAACQ,KAAK;MAAE,CAAE,CAAC,eACpDX,IAAA,CAACJ,IAAI;QAAAc,QAAA,EAAEI,YAAY,CAACkB,IAAI,CAACC,KAAK,CAAC,CAACrB,aAAa,GAAG,EAAE,IAAI,CAAC,CAAC;MAAC,CAAO,CAAC;IAAA,CAC7D,CAAC,eACPZ,IAAA,CAACJ,IAAI;MACH0B,KAAK,EAAEM,MAAM,CAACM,IAAK;MACnBC,QAAQ,EAAGC,CAAC,IAAK;QACf,MAAM;UAAEZ;QAAO,CAAC,GAAGY,CAAC,CAACC,WAAW,CAACC,MAAM;QACvCzB,gBAAgB,CAACW,MAAM,CAAC;MAC1B,CAAE;MAAAd,QAAA,eAEFV,IAAA,CAACJ,IAAI;QAAAc,QAAA,EAAEA;MAAQ,CAAO;IAAC,CACnB,CAAC;EAAA,CACH,CAAC;AAEX;AACA,MAAMkB,MAAM,GAAGjC,UAAU,CAAC4C,MAAM,CAAC;EAC/BV,SAAS,EAAE;IACTW,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDX,WAAW,EAAE;IACXW,UAAU,EAAE,QAAQ;IACpBC,WAAW,EAAE;EACf,CAAC;EACDC,MAAM,EAAE;IACNpB,KAAK,EAAE,CAAC;IACRqB,WAAW,EAAE,CAAC;IACdC,eAAe,EAAE,CAAC;IAClBC,eAAe,EAAEjD,KAAK,CAAC6B,IAAI,CAAC,GAAG,CAAC;IAChCqB,WAAW,EAAE;EACf,CAAC;EACDb,IAAI,EAAE;IACJA,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"DropDown.d.ts","sourceRoot":"","sources":["../../../../src/DropDown/DropDown.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAG5C,QAAA,MAAM,QAAQ,GAAI,iDAKf,aAAa,4CAsEf,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"DropDown.d.ts","sourceRoot":"","sources":["../../../../src/DropDown/DropDown.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAG5C,QAAA,MAAM,QAAQ,GAAI,iDAKf,aAAa,4CAgFf,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -4,6 +4,6 @@ export interface DropDownProps {
4
4
  options: ChipOptionProps[];
5
5
  maxHeight?: number;
6
6
  onSelect?: (value: string | number) => void;
7
- renderButton?: React.ReactNode;
7
+ renderButton: React.ReactNode;
8
8
  }
9
9
  //# sourceMappingURL=type.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/DropDown/type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC"}
1
+ {"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/DropDown/type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B"}
@@ -6,8 +6,8 @@ interface FooterContextType {
6
6
  }
7
7
  interface ProviderProps {
8
8
  children: ReactNode;
9
- requiredUpdated: boolean;
10
- updateConfig: RequiredUpdateAppsProviderProps;
9
+ requiredUpdated?: boolean;
10
+ updateConfig?: RequiredUpdateAppsProviderProps;
11
11
  }
12
12
  export default function Provider({ children, requiredUpdated, updateConfig, }: ProviderProps): import("react/jsx-runtime").JSX.Element;
13
13
  export declare const useFooter: () => FooterContextType;
@@ -1 +1 @@
1
- {"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/Provider/Provider.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,QAAQ,CAAC;AAE9D,UAAU,iBAAiB;IACzB,MAAM,EAAE,GAAG,GAAG,IAAI,CAAC;IACnB,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CACjC;AAED,UAAU,aAAa;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY,EAAE,+BAA+B,CAAC;CAC/C;AAID,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,QAAQ,EACR,eAAuB,EACvB,YAAY,GACb,EAAE,aAAa,2CAaf;AAED,eAAO,MAAM,SAAS,yBAMrB,CAAC"}
1
+ {"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../../src/Provider/Provider.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,QAAQ,CAAC;AAG9D,UAAU,iBAAiB;IACzB,MAAM,EAAE,GAAG,GAAG,IAAI,CAAC;IACnB,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CACjC;AAED,UAAU,aAAa;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,CAAC,EAAE,+BAA+B,CAAC;CAChD;AAID,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,QAAQ,EACR,eAAuB,EACvB,YAAY,GACb,EAAE,aAAa,2CAaf;AAED,eAAO,MAAM,SAAS,yBAMrB,CAAC"}
@@ -1,6 +1,6 @@
1
1
  export interface RequiredUpdateAppsProviderProps {
2
- title: string;
3
- description: string;
2
+ title?: string;
3
+ description?: string;
4
4
  buttonText?: string;
5
5
  onUpdate?: (value: boolean) => void;
6
6
  }
@@ -1 +1 @@
1
- {"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Provider/type.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,+BAA+B;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACrC"}
1
+ {"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Provider/type.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,+BAA+B;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACrC"}
@@ -8,7 +8,7 @@ declare const COLOR_MAP: {
8
8
  type ColorKey = keyof typeof COLOR_MAP;
9
9
  interface TimelineItemProps {
10
10
  children: React.ReactNode;
11
- color: ColorKey;
11
+ color?: ColorKey;
12
12
  }
13
13
  export default function TimelineItem({ children, color, }: TimelineItemProps): import("react/jsx-runtime").JSX.Element;
14
14
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../src/Timeline/TimelineItem.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,SAAS;;;;;;CAMd,CAAC;AACF,KAAK,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAEvC,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,QAAQ,CAAC;CACjB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,QAAQ,EACR,KAAiB,GAClB,EAAE,iBAAiB,2CAoBnB"}
1
+ {"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../src/Timeline/TimelineItem.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,SAAS;;;;;;CAMd,CAAC;AACF,KAAK,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAEvC,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,QAAQ,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,QAAQ,EACR,KAAiB,GAClB,EAAE,iBAAiB,2CAiCnB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@herca/rn-kit",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "description": "React Native UI Kit",
5
5
  "main": "./lib/module/index.js",
6
6
  "types": "./lib/typescript/src/index.d.ts",
@@ -3,11 +3,13 @@ import {
3
3
  View,
4
4
  Text,
5
5
  TouchableOpacity,
6
+ Pressable,
6
7
  StyleSheet,
7
8
  ScrollView,
8
9
  useWindowDimensions,
9
10
  findNodeHandle,
10
11
  UIManager,
12
+ Modal,
11
13
  } from 'react-native';
12
14
  import Color from '../Color/Color';
13
15
  import type { DropDownProps } from './type';
@@ -21,9 +23,13 @@ const Dropdown = ({
21
23
  }: DropDownProps) => {
22
24
  const [isOpen, setIsOpen] = useState(false);
23
25
  const [selected, setSelected] = useState<string | number>();
24
- const [dropdownPosition, setDropdownPosition] = useState<'left' | 'right'>(
25
- 'left'
26
- );
26
+ const [align, setAlign] = useState<'left' | 'right'>('left');
27
+ const [buttonLayout, setButtonLayout] = useState({
28
+ x: 0,
29
+ y: 0,
30
+ width: 0,
31
+ height: 0,
32
+ });
27
33
 
28
34
  const buttonRef = useRef<View>(null);
29
35
  const windowWidth = useWindowDimensions().width;
@@ -32,9 +38,10 @@ const Dropdown = ({
32
38
  if (!isOpen) {
33
39
  const handle = findNodeHandle(buttonRef.current);
34
40
  if (handle) {
35
- UIManager.measureInWindow(handle, (x, _y, width, _height) => {
41
+ UIManager.measureInWindow(handle, (x, y, width, height) => {
36
42
  const middle = windowWidth / 2;
37
- setDropdownPosition(x + width / 2 > middle ? 'right' : 'left');
43
+ setAlign(x + width / 2 > middle ? 'right' : 'left');
44
+ setButtonLayout({ x, y, width, height });
38
45
  setIsOpen(true);
39
46
  });
40
47
  }
@@ -50,70 +57,65 @@ const Dropdown = ({
50
57
  };
51
58
 
52
59
  return (
53
- <View style={styles.container}>
54
- <TouchableOpacity
55
- ref={buttonRef}
56
- style={styles.dropdownButton}
57
- onPress={handleToggle}
58
- >
59
- {renderButton ? (
60
- renderButton
61
- ) : (
62
- <Text>{selected || 'Select an option'}</Text>
63
- )}
60
+ <>
61
+ <TouchableOpacity ref={buttonRef} onPress={handleToggle}>
62
+ {renderButton}
64
63
  </TouchableOpacity>
65
-
66
64
  {isOpen && (
67
- <View
68
- style={[
69
- styles.dropdownList,
70
- dropdownPosition === 'left' ? styles.left : styles.right,
71
- ]}
72
- >
73
- <ScrollView nestedScrollEnabled style={{ maxHeight }}>
74
- {options.map((item, index) => (
75
- <TouchableOpacity
76
- key={index}
77
- onPress={() => handlePressOption(item)}
78
- style={[
79
- styles.option,
80
- selected === item.value ? styles.optionSelected : null,
81
- ]}
82
- >
83
- <Text>{item.label}</Text>
84
- </TouchableOpacity>
85
- ))}
86
- </ScrollView>
87
- </View>
65
+ <Modal transparent animationType="none" visible>
66
+ <Pressable
67
+ style={StyleSheet.absoluteFillObject}
68
+ onPress={() => setIsOpen(false)}
69
+ />
70
+
71
+ <View
72
+ style={[
73
+ styles.dropdownList,
74
+ {
75
+ top: buttonLayout.y + buttonLayout.height,
76
+ left: align === 'left' ? buttonLayout.x : undefined,
77
+ right:
78
+ align === 'right'
79
+ ? windowWidth - (buttonLayout.x + buttonLayout.width)
80
+ : undefined,
81
+ },
82
+ ]}
83
+ >
84
+ <ScrollView nestedScrollEnabled style={{ maxHeight }}>
85
+ {options.map((item, idx) => (
86
+ <TouchableOpacity
87
+ key={idx}
88
+ onPress={() => handlePressOption(item)}
89
+ style={[
90
+ styles.option,
91
+ selected === item.value && styles.optionSelected,
92
+ ]}
93
+ >
94
+ <Text>{item.label}</Text>
95
+ </TouchableOpacity>
96
+ ))}
97
+ </ScrollView>
98
+ </View>
99
+ </Modal>
88
100
  )}
89
- </View>
101
+ </>
90
102
  );
91
103
  };
92
104
 
93
105
  export default Dropdown;
94
106
 
95
107
  const styles = StyleSheet.create({
96
- container: {
97
- // width: 200, // or flexible
98
- },
99
- dropdownButton: {
100
- // borderWidth: 1,
101
- // borderColor: '#ccc',
102
- // padding: 12,
103
- // borderRadius: 6,
104
- // backgroundColor: '#fff',
105
- },
108
+ button: {},
106
109
  dropdownList: {
107
110
  position: 'absolute',
108
- marginTop: 18,
109
111
  padding: 8,
110
- zIndex: 9999,
112
+ zIndex: 10,
111
113
  gap: 4,
112
114
  borderWidth: 1,
113
115
  borderColor: Color.gray[50],
114
116
  borderRadius: 8,
115
117
  backgroundColor: Color.base.white100,
116
- width: 100,
118
+ width: 120,
117
119
  },
118
120
  option: {
119
121
  gap: 8,
@@ -127,10 +129,4 @@ const styles = StyleSheet.create({
127
129
  backgroundColor: Color.primary[50],
128
130
  borderColor: Color.primary[300],
129
131
  },
130
- left: {
131
- left: 0,
132
- },
133
- right: {
134
- right: 0,
135
- },
136
132
  });
@@ -0,0 +1 @@
1
+ # Dropdown
@@ -5,5 +5,5 @@ export interface DropDownProps {
5
5
  options: ChipOptionProps[];
6
6
  maxHeight?: number;
7
7
  onSelect?: (value: string | number) => void;
8
- renderButton?: React.ReactNode;
8
+ renderButton: React.ReactNode;
9
9
  }
@@ -5,6 +5,7 @@ import LayoutWithFooter from './LayoutWithFooter';
5
5
  import RequiredUpdateAppsProvider from './RequiredUpdateAppsProvider';
6
6
  import { type ReactNode } from 'react';
7
7
  import type { RequiredUpdateAppsProviderProps } from './type';
8
+ import Color from '../Color/Color';
8
9
 
9
10
  interface FooterContextType {
10
11
  footer: any | null;
@@ -13,8 +14,8 @@ interface FooterContextType {
13
14
 
14
15
  interface ProviderProps {
15
16
  children: ReactNode;
16
- requiredUpdated: boolean;
17
- updateConfig: RequiredUpdateAppsProviderProps;
17
+ requiredUpdated?: boolean;
18
+ updateConfig?: RequiredUpdateAppsProviderProps;
18
19
  }
19
20
 
20
21
  const FooterContext = createContext<FooterContextType | undefined>(undefined);
@@ -48,6 +49,7 @@ export const useFooter = () => {
48
49
 
49
50
  const styles = StyleSheet.create({
50
51
  container: {
52
+ backgroundColor: Color.base.white100,
51
53
  flex: 1,
52
54
  },
53
55
  });
@@ -1,6 +1,6 @@
1
1
  export interface RequiredUpdateAppsProviderProps {
2
- title: string;
3
- description: string;
2
+ title?: string;
3
+ description?: string;
4
4
  buttonText?: string;
5
5
  onUpdate?: (value: boolean) => void;
6
6
  }
@@ -1,9 +1,15 @@
1
- import { View } from 'react-native';
1
+ import { StyleSheet, View } from 'react-native';
2
2
 
3
3
  interface Timeline {
4
4
  children: React.ReactNode;
5
5
  }
6
6
 
7
7
  export default function Timeline({ children }: Timeline) {
8
- return <View>{children}</View>;
8
+ return <View style={styles.gap14}>{children}</View>;
9
9
  }
10
+
11
+ const styles = StyleSheet.create({
12
+ gap14: {
13
+ gap: 14,
14
+ },
15
+ });
@@ -14,7 +14,7 @@ type ColorKey = keyof typeof COLOR_MAP;
14
14
 
15
15
  interface TimelineItemProps {
16
16
  children: React.ReactNode;
17
- color: ColorKey;
17
+ color?: ColorKey;
18
18
  }
19
19
 
20
20
  export default function TimelineItem({
@@ -22,12 +22,25 @@ export default function TimelineItem({
22
22
  color = 'primary',
23
23
  }: TimelineItemProps) {
24
24
  const [contentHeight, setContentHeight] = useState(0);
25
+ const renderDashes = (count: number) => {
26
+ return Array.from({ length: count }).map((_, index) => (
27
+ <View
28
+ key={index}
29
+ style={{
30
+ width: 1,
31
+ height: 4,
32
+ backgroundColor: Color.gray[400],
33
+ marginVertical: 2,
34
+ }}
35
+ />
36
+ ));
37
+ };
25
38
 
26
39
  return (
27
40
  <View style={styles.container}>
28
41
  <View style={styles.contentLeft}>
29
42
  <Icon name="RadioButton" color={COLOR_MAP[color]} />
30
- <View style={[styles.border, { height: contentHeight - 20 }]} />
43
+ <View>{renderDashes(Math.floor((contentHeight - 20) / 6))}</View>
31
44
  </View>
32
45
  <View
33
46
  style={styles.flex}
@@ -52,10 +65,10 @@ const styles = StyleSheet.create({
52
65
  },
53
66
  border: {
54
67
  width: 1,
68
+ borderWidth: 1,
55
69
  borderLeftWidth: 1,
56
70
  borderLeftColor: Color.gray[400],
57
71
  borderStyle: 'dashed',
58
- marginTop: 4,
59
72
  },
60
73
  flex: {
61
74
  flex: 1,