@draftbit/core 44.1.12 → 44.1.13-91822a.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/components/Accordion/AccordionItem.js +21 -5
- package/lib/commonjs/components/Accordion/index.js.map +1 -1
- package/lib/commonjs/components/Picker/Picker.js +20 -46
- package/lib/commonjs/components/Picker/Picker.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.android.js +59 -0
- package/lib/commonjs/components/Picker/PickerComponent.android.js.map +1 -0
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +87 -0
- package/lib/commonjs/components/Picker/PickerComponent.ios.js.map +1 -0
- package/lib/commonjs/components/Picker/PickerComponent.web.js +59 -0
- package/lib/commonjs/components/Picker/PickerComponent.web.js.map +1 -0
- package/lib/commonjs/components/Portal/PortalManager.js.map +1 -1
- package/lib/commonjs/components/Swiper/Swiper.js.map +1 -1
- package/lib/commonjs/mappings/FAB.js.map +1 -1
- package/lib/commonjs/mappings/RadioButtonRow.js.map +1 -1
- package/lib/commonjs/mappings/RowBodyIcon.js.map +1 -1
- package/lib/commonjs/mappings/ScrollView.js.map +1 -1
- package/lib/commonjs/mappings/Slider.js.map +1 -1
- package/lib/commonjs/mappings/Swiper.js.map +1 -1
- package/lib/commonjs/mappings/View.js.map +1 -1
- package/lib/module/components/DatePicker/DatePickerComponent.web.js.map +1 -1
- package/lib/module/components/Picker/Picker.js +23 -46
- package/lib/module/components/Picker/Picker.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.android.js +41 -0
- package/lib/module/components/Picker/PickerComponent.android.js.map +1 -0
- package/lib/module/components/Picker/PickerComponent.ios.js +64 -0
- package/lib/module/components/Picker/PickerComponent.ios.js.map +1 -0
- package/lib/module/components/Picker/PickerComponent.web.js +41 -0
- package/lib/module/components/Picker/PickerComponent.web.js.map +1 -0
- package/lib/module/components/StepIndicator.js.map +1 -1
- package/lib/typescript/src/components/Picker/PickerComponent.android.d.ts +13 -0
- package/lib/typescript/src/components/Picker/PickerComponent.ios.d.ts +13 -0
- package/lib/typescript/src/components/Picker/PickerComponent.web.d.ts +13 -0
- package/package.json +2 -2
- package/src/components/Picker/Picker.js +20 -19
- package/src/components/Picker/Picker.tsx +27 -12
- package/src/components/Picker/PickerComponent.android.js +20 -0
- package/src/components/Picker/PickerComponent.android.tsx +59 -0
- package/src/components/Picker/PickerComponent.ios.js +40 -0
- package/src/components/Picker/PickerComponent.ios.tsx +86 -0
- package/src/components/Picker/PickerComponent.web.js +20 -0
- package/src/components/Picker/PickerComponent.web.tsx +59 -0
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { StyleSheet, Dimensions } from "react-native";
|
|
3
|
+
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
4
|
+
const {
|
|
5
|
+
width: deviceWidth,
|
|
6
|
+
height: deviceHeight
|
|
7
|
+
} = Dimensions.get("screen");
|
|
8
|
+
export const PickerComponent = _ref => {
|
|
9
|
+
let {
|
|
10
|
+
androidPickerRef,
|
|
11
|
+
togglePickerVisible,
|
|
12
|
+
pickerOptions,
|
|
13
|
+
internalValue,
|
|
14
|
+
handleValueChange
|
|
15
|
+
} = _ref;
|
|
16
|
+
return /*#__PURE__*/React.createElement(NativePicker, {
|
|
17
|
+
selectedValue: internalValue,
|
|
18
|
+
onValueChange: handleValueChange,
|
|
19
|
+
style: styles.nonIosPicker,
|
|
20
|
+
ref: androidPickerRef,
|
|
21
|
+
onBlur: togglePickerVisible
|
|
22
|
+
}, pickerOptions.map(option => /*#__PURE__*/React.createElement(NativePicker.Item, {
|
|
23
|
+
label: option.label,
|
|
24
|
+
value: option.value,
|
|
25
|
+
key: option.value
|
|
26
|
+
})));
|
|
27
|
+
};
|
|
28
|
+
const styles = StyleSheet.create({
|
|
29
|
+
nonIosPicker: {
|
|
30
|
+
opacity: 0,
|
|
31
|
+
position: "absolute",
|
|
32
|
+
top: 0,
|
|
33
|
+
left: 0,
|
|
34
|
+
right: 0,
|
|
35
|
+
bottom: 0,
|
|
36
|
+
width: "100%",
|
|
37
|
+
maxWidth: deviceWidth,
|
|
38
|
+
maxHeight: deviceHeight
|
|
39
|
+
}
|
|
40
|
+
});
|
|
41
|
+
//# sourceMappingURL=PickerComponent.web.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["PickerComponent.web.tsx"],"names":["React","StyleSheet","Dimensions","Picker","NativePicker","width","deviceWidth","height","deviceHeight","get","PickerComponent","androidPickerRef","togglePickerVisible","pickerOptions","internalValue","handleValueChange","styles","nonIosPicker","map","option","label","value","create","opacity","position","top","left","right","bottom","maxWidth","maxHeight"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT,EAAqBC,UAArB,QAAuC,cAAvC;AAEA,SAASC,MAAM,IAAIC,YAAnB,QAAuC,6BAAvC;AAMA,MAAM;AAAEC,EAAAA,KAAK,EAAEC,WAAT;AAAsBC,EAAAA,MAAM,EAAEC;AAA9B,IAA+CN,UAAU,CAACO,GAAX,CAAe,QAAf,CAArD;AAWA,OAAO,MAAMC,eAA+C,GAAG,QAMzD;AAAA,MAN0D;AAC9DC,IAAAA,gBAD8D;AAE9DC,IAAAA,mBAF8D;AAG9DC,IAAAA,aAH8D;AAI9DC,IAAAA,aAJ8D;AAK9DC,IAAAA;AAL8D,GAM1D;AACJ,sBACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAED,aADjB;AAEE,IAAA,aAAa,EAAEC,iBAFjB;AAGE,IAAA,KAAK,EAAEC,MAAM,CAACC,YAHhB;AAIE,IAAA,GAAG,EAAEN,gBAJP;AAKE,IAAA,MAAM,EAAEC;AALV,KAOIC,aAAD,CAA6CK,GAA7C,CAAkDC,MAAD,iBAChD,oBAAC,YAAD,CAAc,IAAd;AACE,IAAA,KAAK,EAAEA,MAAM,CAACC,KADhB;AAEE,IAAA,KAAK,EAAED,MAAM,CAACE,KAFhB;AAGE,IAAA,GAAG,EAAEF,MAAM,CAACE;AAHd,IADD,CAPH,CADF;AAiBD,CAxBM;AA0BP,MAAML,MAAM,GAAGf,UAAU,CAACqB,MAAX,CAAkB;AAC/BL,EAAAA,YAAY,EAAE;AACZM,IAAAA,OAAO,EAAE,CADG;AAEZC,IAAAA,QAAQ,EAAE,UAFE;AAGZC,IAAAA,GAAG,EAAE,CAHO;AAIZC,IAAAA,IAAI,EAAE,CAJM;AAKZC,IAAAA,KAAK,EAAE,CALK;AAMZC,IAAAA,MAAM,EAAE,CANI;AAOZvB,IAAAA,KAAK,EAAE,MAPK;AAQZwB,IAAAA,QAAQ,EAAEvB,WARE;AASZwB,IAAAA,SAAS,EAAEtB;AATC;AADiB,CAAlB,CAAf","sourcesContent":["import * as React from \"react\";\nimport { StyleSheet, Dimensions } from \"react-native\";\n\nimport { Picker as NativePicker } from \"@react-native-picker/picker\";\n\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\nimport { PickerOption } from \"./Picker\";\n\nconst { width: deviceWidth, height: deviceHeight } = Dimensions.get(\"screen\");\n\ninterface PickerComponentProps {\n Icon: IconSlot[\"Icon\"];\n androidPickerRef: React.RefObject<any>;\n togglePickerVisible: () => void;\n pickerOptions: PickerOption[];\n internalValue: string | undefined;\n handleValueChange: (newValue: string, itemIndex: number) => void;\n}\n\nexport const PickerComponent: React.FC<PickerComponentProps> = ({\n androidPickerRef,\n togglePickerVisible,\n pickerOptions,\n internalValue,\n handleValueChange,\n}) => {\n return (\n <NativePicker\n selectedValue={internalValue}\n onValueChange={handleValueChange}\n style={styles.nonIosPicker}\n ref={androidPickerRef}\n onBlur={togglePickerVisible}\n >\n {(pickerOptions as unknown as PickerOption[]).map((option) => (\n <NativePicker.Item\n label={option.label}\n value={option.value}\n key={option.value}\n />\n ))}\n </NativePicker>\n );\n};\n\nconst styles = StyleSheet.create({\n nonIosPicker: {\n opacity: 0,\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n width: \"100%\",\n maxWidth: deviceWidth,\n maxHeight: deviceHeight,\n },\n});\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["StepIndicator.tsx"],"names":["React","Component","View","Text","StyleSheet","Animated","TouchableWithoutFeedback","STEP_STATUS","CURRENT","FINISHED","UNFINISHED","StepIndicator","constructor","props","stepCount","direction","progressBarBackgroundStyle","backgroundColor","state","customStyles","separatorUnFinishedColor","position","left","width","separatorStrokeWidth","top","height","bottom","separatorStrokeUnfinishedWidth","right","event","setState","progressBarSize","nativeEvent","layout","onCurrentPositionChanged","currentPosition","progressBarStyle","separatorFinishedColor","separatorStrokeFinishedWidth","progressAnim","steps","push","stepPressed","styles","stepContainer","flexDirection","renderStep","stepIndicatorContainer","currentStepIndicatorSize","labels","renderLabel","labelViews","map","label","index","selectedStepLabelStyle","color","currentStepLabelColor","labelColor","stepLabelItem","stepStatus","getStepStatus","stepLabel","fontSize","labelSize","fontFamily","labelFontFamily","stepLabelsContainer","paddingHorizontal","paddingVertical","alignItems","labelAlign","renderStepIndicator","stepStyle","indicatorLabelStyle","stepIndicatorCurrentColor","borderWidth","currentStepStrokeWidth","borderColor","stepStrokeCurrentColor","sizeAnim","borderRadius","borderRadiusAnim","currentStepIndicatorLabelFontSize","stepIndicatorLabelCurrentColor","stepIndicatorFinishedColor","stepStrokeWidth","stepStrokeFinishedColor","stepIndicatorSize","stepIndicatorLabelFontSize","stepIndicatorLabelFinishedColor","stepIndicatorUnFinishedColor","stepStrokeUnFinishedColor","overflow","stepIndicatorLabelUnFinishedColor","step","stepPosition","animateToPosition","setValue","sequence","timing","toValue","duration","parallel","start","defaultStyles","Object","assign","Value","onPress","render","container","flex","renderProgressBarBackground","renderProgressBar","renderStepLabels","componentDidUpdate","prevProps","create","justifyContent","zIndex","textAlign","fontWeight","defaultProps"],"mappings":";;AAAA;AACA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA,SACEC,IADF,EAEEC,IAFF,EAGEC,UAHF,EAIEC,QAJF,EAKEC,wBALF,QAMO,cANP;AAQA,MAAMC,WAAW,GAAG;AAClBC,EAAAA,OAAO,EAAE,SADS;AAElBC,EAAAA,QAAQ,EAAE,UAFQ;AAGlBC,EAAAA,UAAU,EAAE;AAHM,CAApB;AA+CA,eAAe,MAAMC,aAAN,SAA4BV,SAA5B,CAAoD;AACjEW,EAAAA,WAAW,CAACC,KAAD,EAAe;AACxB,UAAMA,KAAN;;AADwB,yDAwFI,MAAM;AAClC,YAAM;AAAEC,QAAAA,SAAF;AAAaC,QAAAA;AAAb,UAA2B,KAAKF,KAAtC;AACA,UAAIG,0BAAJ;;AACA,UAAID,SAAS,KAAK,UAAlB,EAA8B;AAC5BC,QAAAA,0BAA0B,GAAG;AAC3BC,UAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwBC,wBADd;AAE3BC,UAAAA,QAAQ,EAAE,UAFiB;AAG3BC,UAAAA,IAAI,EACF,CAAC,KAAKJ,KAAL,CAAWK,KAAX,GAAmB,KAAKL,KAAL,CAAWC,YAAX,CAAwBK,oBAA5C,IAAoE,CAJ3C;AAK3BC,UAAAA,GAAG,EAAE,KAAKP,KAAL,CAAWQ,MAAX,IAAqB,IAAIZ,SAAzB,CALsB;AAM3Ba,UAAAA,MAAM,EAAE,KAAKT,KAAL,CAAWQ,MAAX,IAAqB,IAAIZ,SAAzB,CANmB;AAO3BS,UAAAA,KAAK,EACH,KAAKL,KAAL,CAAWC,YAAX,CAAwBS,8BAAxB,KAA2D,CAA3D,GACI,KAAKV,KAAL,CAAWC,YAAX,CAAwBK,oBAD5B,GAEI,KAAKN,KAAL,CAAWC,YAAX,CAAwBS;AAVH,SAA7B;AAYD,OAbD,MAaO;AACLZ,QAAAA,0BAA0B,GAAG;AAC3BC,UAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwBC,wBADd;AAE3BC,UAAAA,QAAQ,EAAE,UAFiB;AAG3BI,UAAAA,GAAG,EACD,CAAC,KAAKP,KAAL,CAAWQ,MAAX,GAAoB,KAAKR,KAAL,CAAWC,YAAX,CAAwBK,oBAA7C,IACA,CALyB;AAM3BF,UAAAA,IAAI,EAAE,KAAKJ,KAAL,CAAWK,KAAX,IAAoB,IAAIT,SAAxB,CANqB;AAO3Be,UAAAA,KAAK,EAAE,KAAKX,KAAL,CAAWK,KAAX,IAAoB,IAAIT,SAAxB,CAPoB;AAQ3BY,UAAAA,MAAM,EACJ,KAAKR,KAAL,CAAWC,YAAX,CAAwBS,8BAAxB,KAA2D,CAA3D,GACI,KAAKV,KAAL,CAAWC,YAAX,CAAwBK,oBAD5B,GAEI,KAAKN,KAAL,CAAWC,YAAX,CAAwBS;AAXH,SAA7B;AAaD;;AACD,0BACE,oBAAC,IAAD;AACE,QAAA,QAAQ,EAAGE,KAAD,IAAW;AACnB,cAAIf,SAAS,KAAK,UAAlB,EAA8B;AAC5B,iBAAKgB,QAAL,CACE;AAAEC,cAAAA,eAAe,EAAEF,KAAK,CAACG,WAAN,CAAkBC,MAAlB,CAAyBR;AAA5C,aADF,EAEE,MAAM;AACJ,mBAAKS,wBAAL,CAA8B,KAAKtB,KAAL,CAAWuB,eAAzC;AACD,aAJH;AAMD,WAPD,MAOO;AACL,iBAAKL,QAAL,CACE;AAAEC,cAAAA,eAAe,EAAEF,KAAK,CAACG,WAAN,CAAkBC,MAAlB,CAAyBX;AAA5C,aADF,EAEE,MAAM;AACJ,mBAAKY,wBAAL,CAA8B,KAAKtB,KAAL,CAAWuB,eAAzC;AACD,aAJH;AAMD;AACF,SAjBH;AAkBE,QAAA,KAAK,EAAEpB;AAlBT,QADF;AAsBD,KA7IyB;;AAAA,+CA+IN,MAAM;AACxB,YAAM;AAAEF,QAAAA,SAAF;AAAaC,QAAAA;AAAb,UAA2B,KAAKF,KAAtC;AACA,UAAIwB,gBAAJ;;AACA,UAAItB,SAAS,KAAK,UAAlB,EAA8B;AAC5BsB,QAAAA,gBAAgB,GAAG;AACjBpB,UAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwBmB,sBADxB;AAEjBjB,UAAAA,QAAQ,EAAE,UAFO;AAGjBC,UAAAA,IAAI,EACF,CAAC,KAAKJ,KAAL,CAAWK,KAAX,GAAmB,KAAKL,KAAL,CAAWC,YAAX,CAAwBK,oBAA5C,IAAoE,CAJrD;AAKjBC,UAAAA,GAAG,EAAE,KAAKP,KAAL,CAAWQ,MAAX,IAAqB,IAAIZ,SAAzB,CALY;AAMjBa,UAAAA,MAAM,EAAE,KAAKT,KAAL,CAAWQ,MAAX,IAAqB,IAAIZ,SAAzB,CANS;AAOjBS,UAAAA,KAAK,EACH,KAAKL,KAAL,CAAWC,YAAX,CAAwBoB,4BAAxB,KAAyD,CAAzD,GACI,KAAKrB,KAAL,CAAWC,YAAX,CAAwBK,oBAD5B,GAEI,KAAKN,KAAL,CAAWC,YAAX,CAAwBoB,4BAVb;AAWjBb,UAAAA,MAAM,EAAE,KAAKc;AAXI,SAAnB;AAaD,OAdD,MAcO;AACLH,QAAAA,gBAAgB,GAAG;AACjBpB,UAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwBmB,sBADxB;AAEjBjB,UAAAA,QAAQ,EAAE,UAFO;AAGjBI,UAAAA,GAAG,EACD,CAAC,KAAKP,KAAL,CAAWQ,MAAX,GAAoB,KAAKR,KAAL,CAAWC,YAAX,CAAwBK,oBAA7C,IACA,CALe;AAMjBF,UAAAA,IAAI,EAAE,KAAKJ,KAAL,CAAWK,KAAX,IAAoB,IAAIT,SAAxB,CANW;AAOjBe,UAAAA,KAAK,EAAE,KAAKX,KAAL,CAAWK,KAAX,IAAoB,IAAIT,SAAxB,CAPU;AAQjBY,UAAAA,MAAM,EACJ,KAAKR,KAAL,CAAWC,YAAX,CAAwBoB,4BAAxB,KAAyD,CAAzD,GACI,KAAKrB,KAAL,CAAWC,YAAX,CAAwBK,oBAD5B,GAEI,KAAKN,KAAL,CAAWC,YAAX,CAAwBoB,4BAXb;AAYjBhB,UAAAA,KAAK,EAAE,KAAKiB;AAZK,SAAnB;AAcD;;AACD,0BAAO,oBAAC,QAAD,CAAU,IAAV;AAAe,QAAA,KAAK,EAAEH;AAAtB,QAAP;AACD,KAjLyB;;AAAA,iDAmLJ,MAAM;AAC1B,UAAII,KAAK,GAAG,EAAZ;AACA,YAAM;AAAE3B,QAAAA,SAAF;AAAaC,QAAAA;AAAb,UAA2B,KAAKF,KAAtC;;AACA,WAAK,IAAIQ,QAAQ,GAAG,CAApB,EAAuBA,QAAQ,GAAGP,SAAlC,EAA6CO,QAAQ,EAArD,EAAyD;AACvDoB,QAAAA,KAAK,CAACC,IAAN,eACE,oBAAC,wBAAD;AACE,UAAA,GAAG,EAAErB,QADP;AAEE,UAAA,OAAO,EAAE,MAAM,KAAKsB,WAAL,CAAiBtB,QAAjB;AAFjB,wBAIE,oBAAC,IAAD;AACE,UAAA,KAAK,EAAE,CACLuB,MAAM,CAACC,aADF,EAEL9B,SAAS,KAAK,UAAd,GACI;AAAE+B,YAAAA,aAAa,EAAE;AAAjB,WADJ,GAEI;AAAEA,YAAAA,aAAa,EAAE;AAAjB,WAJC;AADT,WAQG,KAAKC,UAAL,CAAgB1B,QAAhB,CARH,CAJF,CADF;AAiBD;;AACD,0BACE,oBAAC,IAAD;AACE,QAAA,QAAQ,EAAGS,KAAD,IACR,KAAKC,QAAL,CAAc;AACZR,UAAAA,KAAK,EAAEO,KAAK,CAACG,WAAN,CAAkBC,MAAlB,CAAyBX,KADpB;AAEZG,UAAAA,MAAM,EAAEI,KAAK,CAACG,WAAN,CAAkBC,MAAlB,CAAyBR;AAFrB,SAAd,CAFJ;AAOE,QAAA,KAAK,EAAE,CACLkB,MAAM,CAACI,sBADF,EAELjC,SAAS,KAAK,UAAd,GACI;AACE+B,UAAAA,aAAa,EAAE,QADjB;AAEEvB,UAAAA,KAAK,EAAE,KAAKL,KAAL,CAAWC,YAAX,CAAwB8B;AAFjC,SADJ,GAKI;AACEH,UAAAA,aAAa,EAAE,KADjB;AAEEpB,UAAAA,MAAM,EAAE,KAAKR,KAAL,CAAWC,YAAX,CAAwB8B;AAFlC,SAPC;AAPT,SAoBGR,KApBH,CADF;AAwBD,KAjOyB;;AAAA,8CAmOP,MAAM;AACvB,YAAM;AAAES,QAAAA,MAAF;AAAUnC,QAAAA,SAAV;AAAqBqB,QAAAA,eAArB;AAAsCe,QAAAA;AAAtC,UAAsD,KAAKtC,KAAjE;AACA,UAAIuC,UAAU,GAAGF,MAAM,CAACG,GAAP,CAAW,CAACC,KAAD,EAAQC,KAAR,KAAkB;AAC5C,cAAMC,sBAAsB,GAC1BD,KAAK,KAAKnB,eAAV,GACI;AAAEqB,UAAAA,KAAK,EAAE,KAAKvC,KAAL,CAAWC,YAAX,CAAwBuC;AAAjC,SADJ,GAEI;AAAED,UAAAA,KAAK,EAAE,KAAKvC,KAAL,CAAWC,YAAX,CAAwBwC;AAAjC,SAHN;AAIA,4BACE,oBAAC,wBAAD;AACE,UAAA,KAAK,EAAEf,MAAM,CAACgB,aADhB;AAEE,UAAA,GAAG,EAAEL,KAFP;AAGE,UAAA,OAAO,EAAE,MAAM,KAAKZ,WAAL,CAAiBY,KAAjB;AAHjB,wBAKE,oBAAC,IAAD;AAAM,UAAA,KAAK,EAAEX,MAAM,CAACgB;AAApB,WACGT,WAAW,GACVA,WAAW,CAAC;AACV9B,UAAAA,QAAQ,EAAEkC,KADA;AAEVM,UAAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBP,KAAnB,CAFF;AAGVD,UAAAA,KAHU;AAIVlB,UAAAA;AAJU,SAAD,CADD,gBAQV,oBAAC,IAAD;AACE,UAAA,KAAK,EAAE,CACLQ,MAAM,CAACmB,SADF,EAELP,sBAFK,EAGL;AACEQ,YAAAA,QAAQ,EAAE,KAAK9C,KAAL,CAAWC,YAAX,CAAwB8C,SADpC;AAEEC,YAAAA,UAAU,EAAE,KAAKhD,KAAL,CAAWC,YAAX,CAAwBgD;AAFtC,WAHK;AADT,WAUGb,KAVH,CATJ,CALF,CADF;AA+BD,OApCgB,CAAjB;AAsCA,0BACE,oBAAC,IAAD;AACE,QAAA,KAAK,EAAE,CACLV,MAAM,CAACwB,mBADF,EAELrD,SAAS,KAAK,UAAd,GACI;AAAE+B,UAAAA,aAAa,EAAE,QAAjB;AAA2BuB,UAAAA,iBAAiB,EAAE;AAA9C,SADJ,GAEI;AAAEvB,UAAAA,aAAa,EAAE,KAAjB;AAAwBwB,UAAAA,eAAe,EAAE;AAAzC,SAJC,EAKL;AAAEC,UAAAA,UAAU,EAAE,KAAKrD,KAAL,CAAWC,YAAX,CAAwBqD;AAAtC,SALK;AADT,SASGpB,UATH,CADF;AAaD,KAxRyB;;AAAA,wCA0RZ/B,QAAD,IAAc;AACzB,YAAM;AAAEoD,QAAAA;AAAF,UAA0B,KAAK5D,KAArC;AACA,UAAI6D,SAAJ;AACA,UAAIC,mBAAJ;;AAEA,cAAQ,KAAKb,aAAL,CAAmBzC,QAAnB,CAAR;AACE,aAAKd,WAAW,CAACC,OAAjB;AAA0B;AACxBkE,YAAAA,SAAS,GAAG;AACVzD,cAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwByD,yBAD/B;AAEVC,cAAAA,WAAW,EAAE,KAAK3D,KAAL,CAAWC,YAAX,CAAwB2D,sBAF3B;AAGVC,cAAAA,WAAW,EAAE,KAAK7D,KAAL,CAAWC,YAAX,CAAwB6D,sBAH3B;AAIVtD,cAAAA,MAAM,EAAE,KAAKuD,QAJH;AAKV1D,cAAAA,KAAK,EAAE,KAAK0D,QALF;AAMVC,cAAAA,YAAY,EAAE,KAAKC;AANT,aAAZ;AAQAR,YAAAA,mBAAmB,GAAG;AACpBX,cAAAA,QAAQ,EAAE,KAAK9C,KAAL,CAAWC,YAAX,CAAwBiE,iCADd;AAEpB3B,cAAAA,KAAK,EAAE,KAAKvC,KAAL,CAAWC,YAAX,CAAwBkE;AAFX,aAAtB;AAKA;AACD;;AACD,aAAK9E,WAAW,CAACE,QAAjB;AAA2B;AACzBiE,YAAAA,SAAS,GAAG;AACVzD,cAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwBmE,0BAD/B;AAEVT,cAAAA,WAAW,EAAE,KAAK3D,KAAL,CAAWC,YAAX,CAAwBoE,eAF3B;AAGVR,cAAAA,WAAW,EAAE,KAAK7D,KAAL,CAAWC,YAAX,CAAwBqE,uBAH3B;AAIV9D,cAAAA,MAAM,EAAE,KAAKR,KAAL,CAAWC,YAAX,CAAwBsE,iBAJtB;AAKVlE,cAAAA,KAAK,EAAE,KAAKL,KAAL,CAAWC,YAAX,CAAwBsE,iBALrB;AAMVP,cAAAA,YAAY,EAAE,KAAKhE,KAAL,CAAWC,YAAX,CAAwBsE,iBAAxB,GAA4C;AANhD,aAAZ;AAQAd,YAAAA,mBAAmB,GAAG;AACpBX,cAAAA,QAAQ,EAAE,KAAK9C,KAAL,CAAWC,YAAX,CAAwBuE,0BADd;AAEpBjC,cAAAA,KAAK,EAAE,KAAKvC,KAAL,CAAWC,YAAX,CAAwBwE;AAFX,aAAtB;AAIA;AACD;;AAED,aAAKpF,WAAW,CAACG,UAAjB;AAA6B;AAC3BgE,YAAAA,SAAS,GAAG;AACVzD,cAAAA,eAAe,EAAE,KAAKC,KAAL,CAAWC,YAAX,CAAwByE,4BAD/B;AAEVf,cAAAA,WAAW,EAAE,KAAK3D,KAAL,CAAWC,YAAX,CAAwBoE,eAF3B;AAGVR,cAAAA,WAAW,EAAE,KAAK7D,KAAL,CAAWC,YAAX,CAAwB0E,yBAH3B;AAIVnE,cAAAA,MAAM,EAAE,KAAKR,KAAL,CAAWC,YAAX,CAAwBsE,iBAJtB;AAKVlE,cAAAA,KAAK,EAAE,KAAKL,KAAL,CAAWC,YAAX,CAAwBsE,iBALrB;AAMVP,cAAAA,YAAY,EAAE,KAAKhE,KAAL,CAAWC,YAAX,CAAwBsE,iBAAxB,GAA4C;AANhD,aAAZ;AAQAd,YAAAA,mBAAmB,GAAG;AACpBmB,cAAAA,QAAQ,EAAE,QADU;AAEpB9B,cAAAA,QAAQ,EAAE,KAAK9C,KAAL,CAAWC,YAAX,CAAwBuE,0BAFd;AAGpBjC,cAAAA,KAAK,EAAE,KAAKvC,KAAL,CAAWC,YAAX,CAAwB4E;AAHX,aAAtB;AAKA;AACD;;AACD;AAjDF;;AAoDA,0BACE,oBAAC,QAAD,CAAU,IAAV;AAAe,QAAA,GAAG,EAAE,gBAApB;AAAsC,QAAA,KAAK,EAAE,CAACnD,MAAM,CAACoD,IAAR,EAActB,SAAd;AAA7C,SACGD,mBAAmB,GAClBA,mBAAmB,CAAC;AAClBpD,QAAAA,QADkB;AAElBwC,QAAAA,UAAU,EAAE,KAAKC,aAAL,CAAmBzC,QAAnB;AAFM,OAAD,CADD,gBAMlB,oBAAC,IAAD;AAAM,QAAA,KAAK,EAAEsD;AAAb,SAAoC,GAAEtD,QAAQ,GAAG,CAAE,EAAnD,CAPJ,CADF;AAYD,KA/VyB;;AAAA,2CAiWT4E,YAAD,IAAkB;AAChC,YAAM;AAAE7D,QAAAA;AAAF,UAAsB,KAAKvB,KAAjC;;AACA,UAAIoF,YAAY,KAAK7D,eAArB,EAAsC;AACpC,eAAO7B,WAAW,CAACC,OAAnB;AACD,OAFD,MAEO,IAAIyF,YAAY,GAAG7D,eAAnB,EAAoC;AACzC,eAAO7B,WAAW,CAACE,QAAnB;AACD,OAFM,MAEA;AACL,eAAOF,WAAW,CAACG,UAAnB;AACD;AACF,KA1WyB;;AAAA,sDA4WEW,QAAD,IAAc;AACvC,UAAI;AAAEP,QAAAA;AAAF,UAAgB,KAAKD,KAAzB;;AACA,UAAIQ,QAAQ,GAAGP,SAAS,GAAG,CAA3B,EAA8B;AAC5BO,QAAAA,QAAQ,GAAGP,SAAS,GAAG,CAAvB;AACD;;AACD,YAAMoF,iBAAiB,GACpB,KAAKhF,KAAL,CAAWc,eAAX,IAA8BlB,SAAS,GAAG,CAA1C,CAAD,GAAiDO,QADnD;AAEA,WAAK4D,QAAL,CAAckB,QAAd,CAAuB,KAAKjF,KAAL,CAAWC,YAAX,CAAwBsE,iBAA/C;AACA,WAAKN,gBAAL,CAAsBgB,QAAtB,CACE,KAAKjF,KAAL,CAAWC,YAAX,CAAwBsE,iBAAxB,GAA4C,CAD9C;AAGApF,MAAAA,QAAQ,CAAC+F,QAAT,CAAkB,CAChB/F,QAAQ,CAACgG,MAAT,CAAgB,KAAK7D,YAArB,EAAmC;AACjC8D,QAAAA,OAAO,EAAEJ,iBADwB;AAEjCK,QAAAA,QAAQ,EAAE;AAFuB,OAAnC,CADgB,EAKhBlG,QAAQ,CAACmG,QAAT,CAAkB,CAChBnG,QAAQ,CAACgG,MAAT,CAAgB,KAAKpB,QAArB,EAA+B;AAC7BqB,QAAAA,OAAO,EAAE,KAAKpF,KAAL,CAAWC,YAAX,CAAwB8B,wBADJ;AAE7BsD,QAAAA,QAAQ,EAAE;AAFmB,OAA/B,CADgB,EAKhBlG,QAAQ,CAACgG,MAAT,CAAgB,KAAKlB,gBAArB,EAAuC;AACrCmB,QAAAA,OAAO,EAAE,KAAKpF,KAAL,CAAWC,YAAX,CAAwB8B,wBAAxB,GAAmD,CADvB;AAErCsD,QAAAA,QAAQ,EAAE;AAF2B,OAAvC,CALgB,CAAlB,CALgB,CAAlB,EAeGE,KAfH;AAgBD,KAvYyB;;AAGxB,UAAMC,aAAa,GAAG;AACpBjB,MAAAA,iBAAiB,EAAE,EADC;AAEpBxC,MAAAA,wBAAwB,EAAE,EAFN;AAGpBzB,MAAAA,oBAAoB,EAAE,CAHF;AAIpBI,MAAAA,8BAA8B,EAAE,CAJZ;AAKpBW,MAAAA,4BAA4B,EAAE,CALV;AAMpBuC,MAAAA,sBAAsB,EAAE,CANJ;AAOpBS,MAAAA,eAAe,EAAE,CAPG;AAQpBP,MAAAA,sBAAsB,EAAE,SARJ;AASpBQ,MAAAA,uBAAuB,EAAE,SATL;AAUpBK,MAAAA,yBAAyB,EAAE,SAVP;AAWpBvD,MAAAA,sBAAsB,EAAE,SAXJ;AAYpBlB,MAAAA,wBAAwB,EAAE,SAZN;AAapBkE,MAAAA,0BAA0B,EAAE,SAbR;AAcpBM,MAAAA,4BAA4B,EAAE,SAdV;AAepBhB,MAAAA,yBAAyB,EAAE,SAfP;AAgBpBc,MAAAA,0BAA0B,EAAE,EAhBR;AAiBpBN,MAAAA,iCAAiC,EAAE,EAjBf;AAkBpBC,MAAAA,8BAA8B,EAAE,SAlBZ;AAmBpBM,MAAAA,+BAA+B,EAAE,SAnBb;AAoBpBI,MAAAA,iCAAiC,EAAE,uBApBf;AAqBpBpC,MAAAA,UAAU,EAAE,SArBQ;AAsBpBM,MAAAA,SAAS,EAAE,EAtBS;AAuBpBO,MAAAA,UAAU,EAAE,QAvBQ;AAwBpBd,MAAAA,qBAAqB,EAAE;AAxBH,KAAtB;AA2BA,UAAMvC,YAAY,GAAGwF,MAAM,CAACC,MAAP,CAAcF,aAAd,EAA6B7F,KAAK,CAACM,YAAnC,CAArB;AAEA,SAAKD,KAAL,GAAa;AACXK,MAAAA,KAAK,EAAE,CADI;AAEXG,MAAAA,MAAM,EAAE,CAFG;AAGXM,MAAAA,eAAe,EAAE,CAAC,CAHP;AAIXb,MAAAA;AAJW,KAAb;AAOA,SAAKqB,YAAL,GAAoB,IAAInC,QAAQ,CAACwG,KAAb,CAAmB,CAAnB,CAApB;AACA,SAAK5B,QAAL,GAAgB,IAAI5E,QAAQ,CAACwG,KAAb,CACd,KAAK3F,KAAL,CAAWC,YAAX,CAAwBsE,iBADV,CAAhB;AAGA,SAAKN,gBAAL,GAAwB,IAAI9E,QAAQ,CAACwG,KAAb,CACtB,KAAK3F,KAAL,CAAWC,YAAX,CAAwBsE,iBAAxB,GAA4C,CADtB,CAAxB;AAGD;;AAED9C,EAAAA,WAAW,CAACtB,QAAD,EAAW;AACpB,QAAI,KAAKR,KAAL,CAAWiG,OAAf,EAAwB;AACtB,WAAKjG,KAAL,CAAWiG,OAAX,CAAmBzF,QAAnB;AACD;AACF;;AAED0F,EAAAA,MAAM,GAAG;AACP,UAAM;AAAE7D,MAAAA,MAAF;AAAUnC,MAAAA;AAAV,QAAwB,KAAKF,KAAnC;AACA,wBACE,oBAAC,IAAD;AACE,MAAA,KAAK,EAAE,CACL+B,MAAM,CAACoE,SADF,EAELjG,SAAS,KAAK,UAAd,GACI;AAAE+B,QAAAA,aAAa,EAAE,KAAjB;AAAwBmE,QAAAA,IAAI,EAAE;AAA9B,OADJ,GAEI;AAAEnE,QAAAA,aAAa,EAAE;AAAjB,OAJC;AADT,OAQG,KAAK5B,KAAL,CAAWK,KAAX,KAAqB,CAArB,IAA0B,KAAK2F,2BAAL,EAR7B,EASG,KAAKhG,KAAL,CAAWK,KAAX,KAAqB,CAArB,IAA0B,KAAK4F,iBAAL,EAT7B,EAUG,KAAK1C,mBAAL,EAVH,EAWGvB,MAAM,IAAI,KAAKkE,gBAAL,EAXb,CADF;AAeD;;AAEDC,EAAAA,kBAAkB,CAACC,SAAD,EAAY;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,QAAIA,SAAS,CAAClF,eAAV,KAA8B,KAAKvB,KAAL,CAAWuB,eAA7C,EAA8D;AAC5D,WAAKD,wBAAL,CAA8B,KAAKtB,KAAL,CAAWuB,eAAzC;AACD;AACF;;AAvFgE;AA2YnE,MAAMQ,MAAM,GAAGxC,UAAU,CAACmH,MAAX,CAAkB;AAC/BP,EAAAA,SAAS,EAAE;AACT/F,IAAAA,eAAe,EAAE;AADR,GADoB;AAI/B+B,EAAAA,sBAAsB,EAAE;AACtBF,IAAAA,aAAa,EAAE,KADO;AAEtByB,IAAAA,UAAU,EAAE,QAFU;AAGtBiD,IAAAA,cAAc,EAAE,cAHM;AAItBvG,IAAAA,eAAe,EAAE;AAJK,GAJO;AAU/BmD,EAAAA,mBAAmB,EAAE;AACnBoD,IAAAA,cAAc,EAAE;AADG,GAVU;AAa/BxB,EAAAA,IAAI,EAAE;AACJzB,IAAAA,UAAU,EAAE,QADR;AAEJiD,IAAAA,cAAc,EAAE,QAFZ;AAGJC,IAAAA,MAAM,EAAE;AAHJ,GAbyB;AAkB/B5E,EAAAA,aAAa,EAAE;AACboE,IAAAA,IAAI,EAAE,CADO;AAEbnE,IAAAA,aAAa,EAAE,KAFF;AAGbyB,IAAAA,UAAU,EAAE,QAHC;AAIbiD,IAAAA,cAAc,EAAE;AAJH,GAlBgB;AAwB/BzD,EAAAA,SAAS,EAAE;AACTC,IAAAA,QAAQ,EAAE,EADD;AAET0D,IAAAA,SAAS,EAAE,QAFF;AAGTC,IAAAA,UAAU,EAAE;AAHH,GAxBoB;AA6B/B/D,EAAAA,aAAa,EAAE;AACbqD,IAAAA,IAAI,EAAE,CADO;AAEb1C,IAAAA,UAAU,EAAE,QAFC;AAGbiD,IAAAA,cAAc,EAAE;AAHH;AA7BgB,CAAlB,CAAf;AAoCA7G,aAAa,CAACiH,YAAd,GAA6B;AAC3BxF,EAAAA,eAAe,EAAE,CADU;AAE3BtB,EAAAA,SAAS,EAAE,CAFgB;AAG3BK,EAAAA,YAAY,EAAE,EAHa;AAI3BJ,EAAAA,SAAS,EAAE;AAJgB,CAA7B","sourcesContent":["// @ts-nocheck\nimport React, { Component } from \"react\";\nimport {\n View,\n Text,\n StyleSheet,\n Animated,\n TouchableWithoutFeedback,\n} from \"react-native\";\n\nconst STEP_STATUS = {\n CURRENT: \"current\",\n FINISHED: \"finished\",\n UNFINISHED: \"unfinished\",\n};\n\ninterface CustomStyles {\n stepIndicatorSize?: number;\n currentStepIndicatorSize?: number;\n separatorStrokeWidth?: number;\n separatorStrokeUnfinishedWidth?: number;\n separatorStrokeFinishedWidth?: number;\n currentStepStrokeWidth: number;\n stepStrokeWidth?: number;\n stepStrokeCurrentColor?: string;\n stepStrokeFinishedColor: string;\n stepStrokeUnFinishedColor: string;\n separatorFinishedColor: string;\n separatorUnFinishedColor: string;\n stepIndicatorFinishedColor: string;\n stepIndicatorUnFinishedColor: string;\n stepIndicatorCurrentColor: string;\n stepIndicatorLabelFontSize: number;\n currentStepIndicatorLabelFontSize?: number;\n stepIndicatorLabelCurrentColor: string;\n stepIndicatorLabelFinishedColor: string;\n stepIndicatorLabelUnFinishedColor: string;\n labelColor?: string;\n labelSize?: number;\n labelAlign?: string;\n currentStepLabelColor?: string;\n labelFontFamily?: string;\n}\n\ntype Props = {\n stepCount: number;\n currentPosition: number;\n customStyles: CustomStyles;\n};\n\ntype State = {\n width: number;\n height: number;\n progressBarSize: number;\n customStyles: CustomStyles;\n};\n\nexport default class StepIndicator extends Component<Props, State> {\n constructor(props: Props) {\n super(props);\n\n const defaultStyles = {\n stepIndicatorSize: 30,\n currentStepIndicatorSize: 40,\n separatorStrokeWidth: 3,\n separatorStrokeUnfinishedWidth: 0,\n separatorStrokeFinishedWidth: 0,\n currentStepStrokeWidth: 5,\n stepStrokeWidth: 0,\n stepStrokeCurrentColor: \"#4aae4f\",\n stepStrokeFinishedColor: \"#4aae4f\",\n stepStrokeUnFinishedColor: \"#4aae4f\",\n separatorFinishedColor: \"#4aae4f\",\n separatorUnFinishedColor: \"#a4d4a5\",\n stepIndicatorFinishedColor: \"#4aae4f\",\n stepIndicatorUnFinishedColor: \"#a4d4a5\",\n stepIndicatorCurrentColor: \"#ffffff\",\n stepIndicatorLabelFontSize: 15,\n currentStepIndicatorLabelFontSize: 15,\n stepIndicatorLabelCurrentColor: \"#000000\",\n stepIndicatorLabelFinishedColor: \"#ffffff\",\n stepIndicatorLabelUnFinishedColor: \"rgba(255,255,255,0.5)\",\n labelColor: \"#000000\",\n labelSize: 13,\n labelAlign: \"center\",\n currentStepLabelColor: \"#4aae4f\",\n };\n\n const customStyles = Object.assign(defaultStyles, props.customStyles);\n\n this.state = {\n width: 0,\n height: 1,\n progressBarSize: -2,\n customStyles,\n };\n\n this.progressAnim = new Animated.Value(0);\n this.sizeAnim = new Animated.Value(\n this.state.customStyles.stepIndicatorSize\n );\n this.borderRadiusAnim = new Animated.Value(\n this.state.customStyles.stepIndicatorSize / 2\n );\n }\n\n stepPressed(position) {\n if (this.props.onPress) {\n this.props.onPress(position);\n }\n }\n\n render() {\n const { labels, direction } = this.props;\n return (\n <View\n style={[\n styles.container,\n direction === \"vertical\"\n ? { flexDirection: \"row\", flex: 1 }\n : { flexDirection: \"column\" },\n ]}\n >\n {this.state.width !== 0 && this.renderProgressBarBackground()}\n {this.state.width !== 0 && this.renderProgressBar()}\n {this.renderStepIndicator()}\n {labels && this.renderStepLabels()}\n </View>\n );\n }\n\n componentDidUpdate(prevProps) {\n // if (prevProps.customStyles !== this.props.customStyles) {\n // this.setState((state) => ({\n // customStyles: Object.assign(\n // state.customStyles,\n // this.props.customStyles\n // ),\n // }));\n // }\n\n if (prevProps.currentPosition !== this.props.currentPosition) {\n this.onCurrentPositionChanged(this.props.currentPosition);\n }\n }\n\n renderProgressBarBackground = () => {\n const { stepCount, direction } = this.props;\n let progressBarBackgroundStyle;\n if (direction === \"vertical\") {\n progressBarBackgroundStyle = {\n backgroundColor: this.state.customStyles.separatorUnFinishedColor,\n position: \"absolute\",\n left:\n (this.state.width - this.state.customStyles.separatorStrokeWidth) / 2,\n top: this.state.height / (2 * stepCount),\n bottom: this.state.height / (2 * stepCount),\n width:\n this.state.customStyles.separatorStrokeUnfinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeUnfinishedWidth,\n };\n } else {\n progressBarBackgroundStyle = {\n backgroundColor: this.state.customStyles.separatorUnFinishedColor,\n position: \"absolute\",\n top:\n (this.state.height - this.state.customStyles.separatorStrokeWidth) /\n 2,\n left: this.state.width / (2 * stepCount),\n right: this.state.width / (2 * stepCount),\n height:\n this.state.customStyles.separatorStrokeUnfinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeUnfinishedWidth,\n };\n }\n return (\n <View\n onLayout={(event) => {\n if (direction === \"vertical\") {\n this.setState(\n { progressBarSize: event.nativeEvent.layout.height },\n () => {\n this.onCurrentPositionChanged(this.props.currentPosition);\n }\n );\n } else {\n this.setState(\n { progressBarSize: event.nativeEvent.layout.width },\n () => {\n this.onCurrentPositionChanged(this.props.currentPosition);\n }\n );\n }\n }}\n style={progressBarBackgroundStyle}\n />\n );\n };\n\n renderProgressBar = () => {\n const { stepCount, direction } = this.props;\n let progressBarStyle;\n if (direction === \"vertical\") {\n progressBarStyle = {\n backgroundColor: this.state.customStyles.separatorFinishedColor,\n position: \"absolute\",\n left:\n (this.state.width - this.state.customStyles.separatorStrokeWidth) / 2,\n top: this.state.height / (2 * stepCount),\n bottom: this.state.height / (2 * stepCount),\n width:\n this.state.customStyles.separatorStrokeFinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeFinishedWidth,\n height: this.progressAnim,\n };\n } else {\n progressBarStyle = {\n backgroundColor: this.state.customStyles.separatorFinishedColor,\n position: \"absolute\",\n top:\n (this.state.height - this.state.customStyles.separatorStrokeWidth) /\n 2,\n left: this.state.width / (2 * stepCount),\n right: this.state.width / (2 * stepCount),\n height:\n this.state.customStyles.separatorStrokeFinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeFinishedWidth,\n width: this.progressAnim,\n };\n }\n return <Animated.View style={progressBarStyle} />;\n };\n\n renderStepIndicator = () => {\n let steps = [];\n const { stepCount, direction } = this.props;\n for (let position = 0; position < stepCount; position++) {\n steps.push(\n <TouchableWithoutFeedback\n key={position}\n onPress={() => this.stepPressed(position)}\n >\n <View\n style={[\n styles.stepContainer,\n direction === \"vertical\"\n ? { flexDirection: \"column\" }\n : { flexDirection: \"row\" },\n ]}\n >\n {this.renderStep(position)}\n </View>\n </TouchableWithoutFeedback>\n );\n }\n return (\n <View\n onLayout={(event) =>\n this.setState({\n width: event.nativeEvent.layout.width,\n height: event.nativeEvent.layout.height,\n })\n }\n style={[\n styles.stepIndicatorContainer,\n direction === \"vertical\"\n ? {\n flexDirection: \"column\",\n width: this.state.customStyles.currentStepIndicatorSize,\n }\n : {\n flexDirection: \"row\",\n height: this.state.customStyles.currentStepIndicatorSize,\n },\n ]}\n >\n {steps}\n </View>\n );\n };\n\n renderStepLabels = () => {\n const { labels, direction, currentPosition, renderLabel } = this.props;\n var labelViews = labels.map((label, index) => {\n const selectedStepLabelStyle =\n index === currentPosition\n ? { color: this.state.customStyles.currentStepLabelColor }\n : { color: this.state.customStyles.labelColor };\n return (\n <TouchableWithoutFeedback\n style={styles.stepLabelItem}\n key={index}\n onPress={() => this.stepPressed(index)}\n >\n <View style={styles.stepLabelItem}>\n {renderLabel ? (\n renderLabel({\n position: index,\n stepStatus: this.getStepStatus(index),\n label,\n currentPosition,\n })\n ) : (\n <Text\n style={[\n styles.stepLabel,\n selectedStepLabelStyle,\n {\n fontSize: this.state.customStyles.labelSize,\n fontFamily: this.state.customStyles.labelFontFamily,\n },\n ]}\n >\n {label}\n </Text>\n )}\n </View>\n </TouchableWithoutFeedback>\n );\n });\n\n return (\n <View\n style={[\n styles.stepLabelsContainer,\n direction === \"vertical\"\n ? { flexDirection: \"column\", paddingHorizontal: 4 }\n : { flexDirection: \"row\", paddingVertical: 4 },\n { alignItems: this.state.customStyles.labelAlign },\n ]}\n >\n {labelViews}\n </View>\n );\n };\n\n renderStep = (position) => {\n const { renderStepIndicator } = this.props;\n let stepStyle;\n let indicatorLabelStyle;\n\n switch (this.getStepStatus(position)) {\n case STEP_STATUS.CURRENT: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorCurrentColor,\n borderWidth: this.state.customStyles.currentStepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeCurrentColor,\n height: this.sizeAnim,\n width: this.sizeAnim,\n borderRadius: this.borderRadiusAnim,\n };\n indicatorLabelStyle = {\n fontSize: this.state.customStyles.currentStepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelCurrentColor,\n };\n\n break;\n }\n case STEP_STATUS.FINISHED: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorFinishedColor,\n borderWidth: this.state.customStyles.stepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeFinishedColor,\n height: this.state.customStyles.stepIndicatorSize,\n width: this.state.customStyles.stepIndicatorSize,\n borderRadius: this.state.customStyles.stepIndicatorSize / 2,\n };\n indicatorLabelStyle = {\n fontSize: this.state.customStyles.stepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelFinishedColor,\n };\n break;\n }\n\n case STEP_STATUS.UNFINISHED: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorUnFinishedColor,\n borderWidth: this.state.customStyles.stepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeUnFinishedColor,\n height: this.state.customStyles.stepIndicatorSize,\n width: this.state.customStyles.stepIndicatorSize,\n borderRadius: this.state.customStyles.stepIndicatorSize / 2,\n };\n indicatorLabelStyle = {\n overflow: \"hidden\",\n fontSize: this.state.customStyles.stepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelUnFinishedColor,\n };\n break;\n }\n default:\n }\n\n return (\n <Animated.View key={\"step-indicator\"} style={[styles.step, stepStyle]}>\n {renderStepIndicator ? (\n renderStepIndicator({\n position,\n stepStatus: this.getStepStatus(position),\n })\n ) : (\n <Text style={indicatorLabelStyle}>{`${position + 1}`}</Text>\n )}\n </Animated.View>\n );\n };\n\n getStepStatus = (stepPosition) => {\n const { currentPosition } = this.props;\n if (stepPosition === currentPosition) {\n return STEP_STATUS.CURRENT;\n } else if (stepPosition < currentPosition) {\n return STEP_STATUS.FINISHED;\n } else {\n return STEP_STATUS.UNFINISHED;\n }\n };\n\n onCurrentPositionChanged = (position) => {\n let { stepCount } = this.props;\n if (position > stepCount - 1) {\n position = stepCount - 1;\n }\n const animateToPosition =\n (this.state.progressBarSize / (stepCount - 1)) * position;\n this.sizeAnim.setValue(this.state.customStyles.stepIndicatorSize);\n this.borderRadiusAnim.setValue(\n this.state.customStyles.stepIndicatorSize / 2\n );\n Animated.sequence([\n Animated.timing(this.progressAnim, {\n toValue: animateToPosition,\n duration: 200,\n }),\n Animated.parallel([\n Animated.timing(this.sizeAnim, {\n toValue: this.state.customStyles.currentStepIndicatorSize,\n duration: 100,\n }),\n Animated.timing(this.borderRadiusAnim, {\n toValue: this.state.customStyles.currentStepIndicatorSize / 2,\n duration: 100,\n }),\n ]),\n ]).start();\n };\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: \"transparent\",\n },\n stepIndicatorContainer: {\n flexDirection: \"row\",\n alignItems: \"center\",\n justifyContent: \"space-around\",\n backgroundColor: \"transparent\",\n },\n stepLabelsContainer: {\n justifyContent: \"space-around\",\n },\n step: {\n alignItems: \"center\",\n justifyContent: \"center\",\n zIndex: 2,\n },\n stepContainer: {\n flex: 1,\n flexDirection: \"row\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n stepLabel: {\n fontSize: 12,\n textAlign: \"center\",\n fontWeight: \"500\",\n },\n stepLabelItem: {\n flex: 1,\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n});\n\nStepIndicator.defaultProps = {\n currentPosition: 0,\n stepCount: 5,\n customStyles: {},\n direction: \"horizontal\",\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["StepIndicator.js"],"names":["React","Component","View","Text","StyleSheet","Animated","TouchableWithoutFeedback","STEP_STATUS","CURRENT","FINISHED","UNFINISHED","StepIndicator","constructor","props","stepCount","direction","progressBarBackgroundStyle","backgroundColor","state","customStyles","separatorUnFinishedColor","position","left","width","separatorStrokeWidth","top","height","bottom","separatorStrokeUnfinishedWidth","right","createElement","onLayout","event","setState","progressBarSize","nativeEvent","layout","onCurrentPositionChanged","currentPosition","style","progressBarStyle","separatorFinishedColor","separatorStrokeFinishedWidth","progressAnim","steps","push","key","onPress","stepPressed","styles","stepContainer","flexDirection","renderStep","stepIndicatorContainer","currentStepIndicatorSize","labels","renderLabel","labelViews","map","label","index","selectedStepLabelStyle","color","currentStepLabelColor","labelColor","stepLabelItem","stepStatus","getStepStatus","stepLabel","fontSize","labelSize","fontFamily","labelFontFamily","stepLabelsContainer","paddingHorizontal","paddingVertical","alignItems","labelAlign","renderStepIndicator","stepStyle","indicatorLabelStyle","stepIndicatorCurrentColor","borderWidth","currentStepStrokeWidth","borderColor","stepStrokeCurrentColor","sizeAnim","borderRadius","borderRadiusAnim","currentStepIndicatorLabelFontSize","stepIndicatorLabelCurrentColor","stepIndicatorFinishedColor","stepStrokeWidth","stepStrokeFinishedColor","stepIndicatorSize","stepIndicatorLabelFontSize","stepIndicatorLabelFinishedColor","stepIndicatorUnFinishedColor","stepStrokeUnFinishedColor","overflow","stepIndicatorLabelUnFinishedColor","step","stepPosition","animateToPosition","setValue","sequence","timing","toValue","duration","parallel","start","defaultStyles","Object","assign","Value","render","container","flex","renderProgressBarBackground","renderProgressBar","renderStepLabels","componentDidUpdate","prevProps","create","justifyContent","zIndex","textAlign","fontWeight","defaultProps"],"mappings":"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","sourcesContent":["// @ts-nocheck\nimport React, { Component } from \"react\";\nimport { View, Text, StyleSheet, Animated, TouchableWithoutFeedback, } from \"react-native\";\nconst STEP_STATUS = {\n CURRENT: \"current\",\n FINISHED: \"finished\",\n UNFINISHED: \"unfinished\",\n};\nexport default class StepIndicator extends Component {\n constructor(props) {\n super(props);\n const defaultStyles = {\n stepIndicatorSize: 30,\n currentStepIndicatorSize: 40,\n separatorStrokeWidth: 3,\n separatorStrokeUnfinishedWidth: 0,\n separatorStrokeFinishedWidth: 0,\n currentStepStrokeWidth: 5,\n stepStrokeWidth: 0,\n stepStrokeCurrentColor: \"#4aae4f\",\n stepStrokeFinishedColor: \"#4aae4f\",\n stepStrokeUnFinishedColor: \"#4aae4f\",\n separatorFinishedColor: \"#4aae4f\",\n separatorUnFinishedColor: \"#a4d4a5\",\n stepIndicatorFinishedColor: \"#4aae4f\",\n stepIndicatorUnFinishedColor: \"#a4d4a5\",\n stepIndicatorCurrentColor: \"#ffffff\",\n stepIndicatorLabelFontSize: 15,\n currentStepIndicatorLabelFontSize: 15,\n stepIndicatorLabelCurrentColor: \"#000000\",\n stepIndicatorLabelFinishedColor: \"#ffffff\",\n stepIndicatorLabelUnFinishedColor: \"rgba(255,255,255,0.5)\",\n labelColor: \"#000000\",\n labelSize: 13,\n labelAlign: \"center\",\n currentStepLabelColor: \"#4aae4f\",\n };\n const customStyles = Object.assign(defaultStyles, props.customStyles);\n this.state = {\n width: 0,\n height: 1,\n progressBarSize: -2,\n customStyles,\n };\n this.progressAnim = new Animated.Value(0);\n this.sizeAnim = new Animated.Value(this.state.customStyles.stepIndicatorSize);\n this.borderRadiusAnim = new Animated.Value(this.state.customStyles.stepIndicatorSize / 2);\n }\n stepPressed(position) {\n if (this.props.onPress) {\n this.props.onPress(position);\n }\n }\n render() {\n const { labels, direction } = this.props;\n return (React.createElement(View, { style: [\n styles.container,\n direction === \"vertical\"\n ? { flexDirection: \"row\", flex: 1 }\n : { flexDirection: \"column\" },\n ] },\n this.state.width !== 0 && this.renderProgressBarBackground(),\n this.state.width !== 0 && this.renderProgressBar(),\n this.renderStepIndicator(),\n labels && this.renderStepLabels()));\n }\n componentDidUpdate(prevProps) {\n // if (prevProps.customStyles !== this.props.customStyles) {\n // this.setState((state) => ({\n // customStyles: Object.assign(\n // state.customStyles,\n // this.props.customStyles\n // ),\n // }));\n // }\n if (prevProps.currentPosition !== this.props.currentPosition) {\n this.onCurrentPositionChanged(this.props.currentPosition);\n }\n }\n renderProgressBarBackground = () => {\n const { stepCount, direction } = this.props;\n let progressBarBackgroundStyle;\n if (direction === \"vertical\") {\n progressBarBackgroundStyle = {\n backgroundColor: this.state.customStyles.separatorUnFinishedColor,\n position: \"absolute\",\n left: (this.state.width - this.state.customStyles.separatorStrokeWidth) / 2,\n top: this.state.height / (2 * stepCount),\n bottom: this.state.height / (2 * stepCount),\n width: this.state.customStyles.separatorStrokeUnfinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeUnfinishedWidth,\n };\n }\n else {\n progressBarBackgroundStyle = {\n backgroundColor: this.state.customStyles.separatorUnFinishedColor,\n position: \"absolute\",\n top: (this.state.height - this.state.customStyles.separatorStrokeWidth) /\n 2,\n left: this.state.width / (2 * stepCount),\n right: this.state.width / (2 * stepCount),\n height: this.state.customStyles.separatorStrokeUnfinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeUnfinishedWidth,\n };\n }\n return (React.createElement(View, { onLayout: (event) => {\n if (direction === \"vertical\") {\n this.setState({ progressBarSize: event.nativeEvent.layout.height }, () => {\n this.onCurrentPositionChanged(this.props.currentPosition);\n });\n }\n else {\n this.setState({ progressBarSize: event.nativeEvent.layout.width }, () => {\n this.onCurrentPositionChanged(this.props.currentPosition);\n });\n }\n }, style: progressBarBackgroundStyle }));\n };\n renderProgressBar = () => {\n const { stepCount, direction } = this.props;\n let progressBarStyle;\n if (direction === \"vertical\") {\n progressBarStyle = {\n backgroundColor: this.state.customStyles.separatorFinishedColor,\n position: \"absolute\",\n left: (this.state.width - this.state.customStyles.separatorStrokeWidth) / 2,\n top: this.state.height / (2 * stepCount),\n bottom: this.state.height / (2 * stepCount),\n width: this.state.customStyles.separatorStrokeFinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeFinishedWidth,\n height: this.progressAnim,\n };\n }\n else {\n progressBarStyle = {\n backgroundColor: this.state.customStyles.separatorFinishedColor,\n position: \"absolute\",\n top: (this.state.height - this.state.customStyles.separatorStrokeWidth) /\n 2,\n left: this.state.width / (2 * stepCount),\n right: this.state.width / (2 * stepCount),\n height: this.state.customStyles.separatorStrokeFinishedWidth === 0\n ? this.state.customStyles.separatorStrokeWidth\n : this.state.customStyles.separatorStrokeFinishedWidth,\n width: this.progressAnim,\n };\n }\n return React.createElement(Animated.View, { style: progressBarStyle });\n };\n renderStepIndicator = () => {\n let steps = [];\n const { stepCount, direction } = this.props;\n for (let position = 0; position < stepCount; position++) {\n steps.push(React.createElement(TouchableWithoutFeedback, { key: position, onPress: () => this.stepPressed(position) },\n React.createElement(View, { style: [\n styles.stepContainer,\n direction === \"vertical\"\n ? { flexDirection: \"column\" }\n : { flexDirection: \"row\" },\n ] }, this.renderStep(position))));\n }\n return (React.createElement(View, { onLayout: (event) => this.setState({\n width: event.nativeEvent.layout.width,\n height: event.nativeEvent.layout.height,\n }), style: [\n styles.stepIndicatorContainer,\n direction === \"vertical\"\n ? {\n flexDirection: \"column\",\n width: this.state.customStyles.currentStepIndicatorSize,\n }\n : {\n flexDirection: \"row\",\n height: this.state.customStyles.currentStepIndicatorSize,\n },\n ] }, steps));\n };\n renderStepLabels = () => {\n const { labels, direction, currentPosition, renderLabel } = this.props;\n var labelViews = labels.map((label, index) => {\n const selectedStepLabelStyle = index === currentPosition\n ? { color: this.state.customStyles.currentStepLabelColor }\n : { color: this.state.customStyles.labelColor };\n return (React.createElement(TouchableWithoutFeedback, { style: styles.stepLabelItem, key: index, onPress: () => this.stepPressed(index) },\n React.createElement(View, { style: styles.stepLabelItem }, renderLabel ? (renderLabel({\n position: index,\n stepStatus: this.getStepStatus(index),\n label,\n currentPosition,\n })) : (React.createElement(Text, { style: [\n styles.stepLabel,\n selectedStepLabelStyle,\n {\n fontSize: this.state.customStyles.labelSize,\n fontFamily: this.state.customStyles.labelFontFamily,\n },\n ] }, label)))));\n });\n return (React.createElement(View, { style: [\n styles.stepLabelsContainer,\n direction === \"vertical\"\n ? { flexDirection: \"column\", paddingHorizontal: 4 }\n : { flexDirection: \"row\", paddingVertical: 4 },\n { alignItems: this.state.customStyles.labelAlign },\n ] }, labelViews));\n };\n renderStep = (position) => {\n const { renderStepIndicator } = this.props;\n let stepStyle;\n let indicatorLabelStyle;\n switch (this.getStepStatus(position)) {\n case STEP_STATUS.CURRENT: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorCurrentColor,\n borderWidth: this.state.customStyles.currentStepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeCurrentColor,\n height: this.sizeAnim,\n width: this.sizeAnim,\n borderRadius: this.borderRadiusAnim,\n };\n indicatorLabelStyle = {\n fontSize: this.state.customStyles.currentStepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelCurrentColor,\n };\n break;\n }\n case STEP_STATUS.FINISHED: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorFinishedColor,\n borderWidth: this.state.customStyles.stepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeFinishedColor,\n height: this.state.customStyles.stepIndicatorSize,\n width: this.state.customStyles.stepIndicatorSize,\n borderRadius: this.state.customStyles.stepIndicatorSize / 2,\n };\n indicatorLabelStyle = {\n fontSize: this.state.customStyles.stepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelFinishedColor,\n };\n break;\n }\n case STEP_STATUS.UNFINISHED: {\n stepStyle = {\n backgroundColor: this.state.customStyles.stepIndicatorUnFinishedColor,\n borderWidth: this.state.customStyles.stepStrokeWidth,\n borderColor: this.state.customStyles.stepStrokeUnFinishedColor,\n height: this.state.customStyles.stepIndicatorSize,\n width: this.state.customStyles.stepIndicatorSize,\n borderRadius: this.state.customStyles.stepIndicatorSize / 2,\n };\n indicatorLabelStyle = {\n overflow: \"hidden\",\n fontSize: this.state.customStyles.stepIndicatorLabelFontSize,\n color: this.state.customStyles.stepIndicatorLabelUnFinishedColor,\n };\n break;\n }\n default:\n }\n return (React.createElement(Animated.View, { key: \"step-indicator\", style: [styles.step, stepStyle] }, renderStepIndicator ? (renderStepIndicator({\n position,\n stepStatus: this.getStepStatus(position),\n })) : (React.createElement(Text, { style: indicatorLabelStyle }, `${position + 1}`))));\n };\n getStepStatus = (stepPosition) => {\n const { currentPosition } = this.props;\n if (stepPosition === currentPosition) {\n return STEP_STATUS.CURRENT;\n }\n else if (stepPosition < currentPosition) {\n return STEP_STATUS.FINISHED;\n }\n else {\n return STEP_STATUS.UNFINISHED;\n }\n };\n onCurrentPositionChanged = (position) => {\n let { stepCount } = this.props;\n if (position > stepCount - 1) {\n position = stepCount - 1;\n }\n const animateToPosition = (this.state.progressBarSize / (stepCount - 1)) * position;\n this.sizeAnim.setValue(this.state.customStyles.stepIndicatorSize);\n this.borderRadiusAnim.setValue(this.state.customStyles.stepIndicatorSize / 2);\n Animated.sequence([\n Animated.timing(this.progressAnim, {\n toValue: animateToPosition,\n duration: 200,\n }),\n Animated.parallel([\n Animated.timing(this.sizeAnim, {\n toValue: this.state.customStyles.currentStepIndicatorSize,\n duration: 100,\n }),\n Animated.timing(this.borderRadiusAnim, {\n toValue: this.state.customStyles.currentStepIndicatorSize / 2,\n duration: 100,\n }),\n ]),\n ]).start();\n };\n}\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: \"transparent\",\n },\n stepIndicatorContainer: {\n flexDirection: \"row\",\n alignItems: \"center\",\n justifyContent: \"space-around\",\n backgroundColor: \"transparent\",\n },\n stepLabelsContainer: {\n justifyContent: \"space-around\",\n },\n step: {\n alignItems: \"center\",\n justifyContent: \"center\",\n zIndex: 2,\n },\n stepContainer: {\n flex: 1,\n flexDirection: \"row\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n stepLabel: {\n fontSize: 12,\n textAlign: \"center\",\n fontWeight: \"500\",\n },\n stepLabelItem: {\n flex: 1,\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n});\nStepIndicator.defaultProps = {\n currentPosition: 0,\n stepCount: 5,\n customStyles: {},\n direction: \"horizontal\",\n};\n"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import type { IconSlot } from "../../interfaces/Icon";
|
|
3
|
+
import { PickerOption } from "./Picker";
|
|
4
|
+
interface PickerComponentProps {
|
|
5
|
+
Icon: IconSlot["Icon"];
|
|
6
|
+
androidPickerRef: React.RefObject<any>;
|
|
7
|
+
togglePickerVisible: () => void;
|
|
8
|
+
pickerOptions: PickerOption[];
|
|
9
|
+
internalValue: string | undefined;
|
|
10
|
+
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const PickerComponent: React.FC<PickerComponentProps>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import type { IconSlot } from "../../interfaces/Icon";
|
|
3
|
+
import { PickerOption } from "./Picker";
|
|
4
|
+
interface PickerComponentProps {
|
|
5
|
+
Icon: IconSlot["Icon"];
|
|
6
|
+
androidPickerRef: React.RefObject<any>;
|
|
7
|
+
togglePickerVisible: () => void;
|
|
8
|
+
pickerOptions: PickerOption[];
|
|
9
|
+
internalValue: string | undefined;
|
|
10
|
+
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const PickerComponent: React.FC<PickerComponentProps>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import type { IconSlot } from "../../interfaces/Icon";
|
|
3
|
+
import { PickerOption } from "./Picker";
|
|
4
|
+
interface PickerComponentProps {
|
|
5
|
+
Icon: IconSlot["Icon"];
|
|
6
|
+
androidPickerRef: React.RefObject<any>;
|
|
7
|
+
togglePickerVisible: () => void;
|
|
8
|
+
pickerOptions: PickerOption[];
|
|
9
|
+
internalValue: string | undefined;
|
|
10
|
+
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const PickerComponent: React.FC<PickerComponentProps>;
|
|
13
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "44.1.
|
|
3
|
+
"version": "44.1.13-91822a.0+91822a37",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
]
|
|
80
80
|
]
|
|
81
81
|
},
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "91822a37fa20fb68fa7dbea1b715d957996e2366"
|
|
83
83
|
}
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { View, StyleSheet, Text,
|
|
2
|
+
import { View, StyleSheet, Text, Dimensions, } from "react-native";
|
|
3
3
|
import { omit, pickBy, identity, isObject } from "lodash";
|
|
4
|
-
import { SafeAreaView } from "react-native-safe-area-context";
|
|
5
|
-
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
4
|
+
// import { SafeAreaView } from "react-native-safe-area-context";
|
|
5
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
6
6
|
import { withTheme } from "../../theming";
|
|
7
|
-
import Portal from "../Portal/Portal";
|
|
8
|
-
import Button from "../DeprecatedButton";
|
|
7
|
+
// import Portal from "../Portal/Portal";
|
|
8
|
+
// import Button from "../DeprecatedButton";
|
|
9
9
|
import Touchable from "../Touchable";
|
|
10
10
|
import { extractStyles, extractBorderAndMarginStyles, borderStyleNames, marginStyleNames, } from "../../utilities";
|
|
11
|
+
// @ts-expect-error
|
|
12
|
+
import { PickerComponent } from "./PickerComponent";
|
|
11
13
|
function normalizeOptions(options) {
|
|
12
14
|
if (options.length === 0) {
|
|
13
15
|
return [];
|
|
@@ -31,11 +33,13 @@ function normalizeOptions(options) {
|
|
|
31
33
|
throw new Error('Picker options must be either an array of strings or array of { "label": string; "value": string; } objects.');
|
|
32
34
|
}
|
|
33
35
|
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
34
|
-
const isIos = Platform.OS === "ios";
|
|
36
|
+
// const isIos = Platform.OS === "ios";
|
|
35
37
|
const unstyledColor = "rgba(165, 173, 183, 1)";
|
|
36
38
|
const disabledColor = "rgb(240, 240, 240)";
|
|
37
39
|
const errorColor = "rgba(255, 69, 100, 1)";
|
|
38
|
-
const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style, placeholder, value, disabled = false,
|
|
40
|
+
const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style, placeholder, value, disabled = false,
|
|
41
|
+
// theme,
|
|
42
|
+
assistiveText, label, iconColor = unstyledColor, iconSize = 24, leftIconMode = "inset", leftIconName, placeholderTextColor = unstyledColor, rightIconName, type = "solid", }) => {
|
|
39
43
|
const androidPickerRef = React.useRef(undefined);
|
|
40
44
|
const [internalValue, setInternalValue] = React.useState(value || defaultValue);
|
|
41
45
|
const [pickerVisible, setPickerVisible] = React.useState(false);
|
|
@@ -61,7 +65,7 @@ const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style,
|
|
|
61
65
|
const pickerOptions = placeholder
|
|
62
66
|
? [{ value: placeholder, label: placeholder }, ...normalizedOptions]
|
|
63
67
|
: normalizedOptions;
|
|
64
|
-
const { colors } = theme;
|
|
68
|
+
// const { colors } = theme;
|
|
65
69
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
66
70
|
const additionalBorderStyles = ["backgroundColor"];
|
|
67
71
|
const additionalMarginStyles = [
|
|
@@ -181,17 +185,14 @@ const Picker = ({ error, options = [], onValueChange, defaultValue, Icon, style,
|
|
|
181
185
|
React.createElement(Text, { style: primaryTextStyle }, String(selectedLabel ?? placeholder))),
|
|
182
186
|
rightIcon)),
|
|
183
187
|
assistiveTextLabel),
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
React.createElement(Button, { Icon: Icon, type: "text", onPress: togglePickerVisible, style: styles.iosButton }, "Close"),
|
|
193
|
-
React.createElement(NativePicker, { style: styles.iosNativePicker, selectedValue: internalValue, onValueChange: handleValueChange }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value })))))))) : null,
|
|
194
|
-
!isIos && pickerVisible ? (React.createElement(NativePicker, { enabled: pickerVisible, selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: () => setPickerVisible(false) }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value }))))) : null));
|
|
188
|
+
pickerVisible ? (React.createElement(PickerComponent, { ...{
|
|
189
|
+
Icon,
|
|
190
|
+
androidPickerRef,
|
|
191
|
+
togglePickerVisible,
|
|
192
|
+
pickerOptions,
|
|
193
|
+
internalValue,
|
|
194
|
+
handleValueChange,
|
|
195
|
+
} })) : null));
|
|
195
196
|
};
|
|
196
197
|
export default withTheme(Picker);
|
|
197
198
|
const styles = StyleSheet.create({
|
|
@@ -3,18 +3,18 @@ import {
|
|
|
3
3
|
View,
|
|
4
4
|
StyleSheet,
|
|
5
5
|
Text,
|
|
6
|
-
Platform,
|
|
6
|
+
// Platform,
|
|
7
7
|
ViewStyle,
|
|
8
8
|
StyleProp,
|
|
9
9
|
Dimensions,
|
|
10
10
|
} from "react-native";
|
|
11
11
|
import { omit, pickBy, identity, isObject } from "lodash";
|
|
12
|
-
import { SafeAreaView } from "react-native-safe-area-context";
|
|
13
|
-
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
12
|
+
// import { SafeAreaView } from "react-native-safe-area-context";
|
|
13
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
14
14
|
|
|
15
15
|
import { withTheme } from "../../theming";
|
|
16
|
-
import Portal from "../Portal/Portal";
|
|
17
|
-
import Button from "../DeprecatedButton";
|
|
16
|
+
// import Portal from "../Portal/Portal";
|
|
17
|
+
// import Button from "../DeprecatedButton";
|
|
18
18
|
import Touchable from "../Touchable";
|
|
19
19
|
import type { Theme } from "../../styles/DefaultTheme";
|
|
20
20
|
import type { IconSlot } from "../../interfaces/Icon";
|
|
@@ -24,6 +24,8 @@ import {
|
|
|
24
24
|
borderStyleNames,
|
|
25
25
|
marginStyleNames,
|
|
26
26
|
} from "../../utilities";
|
|
27
|
+
// @ts-expect-error
|
|
28
|
+
import { PickerComponent } from "./PickerComponent";
|
|
27
29
|
|
|
28
30
|
export interface PickerOption {
|
|
29
31
|
value: string;
|
|
@@ -83,7 +85,7 @@ function normalizeOptions(options: PickerProps["options"]): PickerOption[] {
|
|
|
83
85
|
}
|
|
84
86
|
|
|
85
87
|
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
86
|
-
const isIos = Platform.OS === "ios";
|
|
88
|
+
// const isIos = Platform.OS === "ios";
|
|
87
89
|
const unstyledColor = "rgba(165, 173, 183, 1)";
|
|
88
90
|
const disabledColor = "rgb(240, 240, 240)";
|
|
89
91
|
const errorColor = "rgba(255, 69, 100, 1)";
|
|
@@ -98,7 +100,7 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
98
100
|
placeholder,
|
|
99
101
|
value,
|
|
100
102
|
disabled = false,
|
|
101
|
-
theme,
|
|
103
|
+
// theme,
|
|
102
104
|
assistiveText,
|
|
103
105
|
label,
|
|
104
106
|
iconColor = unstyledColor,
|
|
@@ -145,7 +147,7 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
145
147
|
? [{ value: placeholder, label: placeholder }, ...normalizedOptions]
|
|
146
148
|
: normalizedOptions;
|
|
147
149
|
|
|
148
|
-
const { colors } = theme;
|
|
150
|
+
// const { colors } = theme;
|
|
149
151
|
|
|
150
152
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
151
153
|
|
|
@@ -344,8 +346,21 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
344
346
|
{assistiveTextLabel}
|
|
345
347
|
</Touchable>
|
|
346
348
|
|
|
349
|
+
{pickerVisible ? (
|
|
350
|
+
<PickerComponent
|
|
351
|
+
{...{
|
|
352
|
+
Icon,
|
|
353
|
+
androidPickerRef,
|
|
354
|
+
togglePickerVisible,
|
|
355
|
+
pickerOptions,
|
|
356
|
+
internalValue,
|
|
357
|
+
handleValueChange,
|
|
358
|
+
}}
|
|
359
|
+
/>
|
|
360
|
+
) : null}
|
|
361
|
+
|
|
347
362
|
{/* iosPicker */}
|
|
348
|
-
{isIos && pickerVisible ? (
|
|
363
|
+
{/* isIos && pickerVisible ? (
|
|
349
364
|
<Portal>
|
|
350
365
|
<View
|
|
351
366
|
style={[
|
|
@@ -381,10 +396,10 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
381
396
|
</SafeAreaView>
|
|
382
397
|
</View>
|
|
383
398
|
</Portal>
|
|
384
|
-
) : null}
|
|
399
|
+
) : null */}
|
|
385
400
|
|
|
386
401
|
{/* nonIosPicker */}
|
|
387
|
-
{!isIos && pickerVisible ? (
|
|
402
|
+
{/* !isIos && pickerVisible ? (
|
|
388
403
|
<NativePicker
|
|
389
404
|
enabled={pickerVisible}
|
|
390
405
|
selectedValue={internalValue}
|
|
@@ -401,7 +416,7 @@ const Picker: React.FC<PickerProps> = ({
|
|
|
401
416
|
/>
|
|
402
417
|
))}
|
|
403
418
|
</NativePicker>
|
|
404
|
-
) : null}
|
|
419
|
+
) : null */}
|
|
405
420
|
</View>
|
|
406
421
|
);
|
|
407
422
|
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { StyleSheet, Dimensions } from "react-native";
|
|
3
|
+
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
4
|
+
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
5
|
+
export const PickerComponent = ({ androidPickerRef, togglePickerVisible, pickerOptions, internalValue, handleValueChange, }) => {
|
|
6
|
+
return (React.createElement(NativePicker, { selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: togglePickerVisible }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value })))));
|
|
7
|
+
};
|
|
8
|
+
const styles = StyleSheet.create({
|
|
9
|
+
nonIosPicker: {
|
|
10
|
+
opacity: 0,
|
|
11
|
+
position: "absolute",
|
|
12
|
+
top: 0,
|
|
13
|
+
left: 0,
|
|
14
|
+
right: 0,
|
|
15
|
+
bottom: 0,
|
|
16
|
+
width: "100%",
|
|
17
|
+
maxWidth: deviceWidth,
|
|
18
|
+
maxHeight: deviceHeight,
|
|
19
|
+
},
|
|
20
|
+
});
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { StyleSheet, Dimensions } from "react-native";
|
|
3
|
+
|
|
4
|
+
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
|
+
|
|
6
|
+
import type { IconSlot } from "../../interfaces/Icon";
|
|
7
|
+
|
|
8
|
+
import { PickerOption } from "./Picker";
|
|
9
|
+
|
|
10
|
+
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
11
|
+
|
|
12
|
+
interface PickerComponentProps {
|
|
13
|
+
Icon: IconSlot["Icon"];
|
|
14
|
+
androidPickerRef: React.RefObject<any>;
|
|
15
|
+
togglePickerVisible: () => void;
|
|
16
|
+
pickerOptions: PickerOption[];
|
|
17
|
+
internalValue: string | undefined;
|
|
18
|
+
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export const PickerComponent: React.FC<PickerComponentProps> = ({
|
|
22
|
+
androidPickerRef,
|
|
23
|
+
togglePickerVisible,
|
|
24
|
+
pickerOptions,
|
|
25
|
+
internalValue,
|
|
26
|
+
handleValueChange,
|
|
27
|
+
}) => {
|
|
28
|
+
return (
|
|
29
|
+
<NativePicker
|
|
30
|
+
selectedValue={internalValue}
|
|
31
|
+
onValueChange={handleValueChange}
|
|
32
|
+
style={styles.nonIosPicker}
|
|
33
|
+
ref={androidPickerRef}
|
|
34
|
+
onBlur={togglePickerVisible}
|
|
35
|
+
>
|
|
36
|
+
{(pickerOptions as unknown as PickerOption[]).map((option) => (
|
|
37
|
+
<NativePicker.Item
|
|
38
|
+
label={option.label}
|
|
39
|
+
value={option.value}
|
|
40
|
+
key={option.value}
|
|
41
|
+
/>
|
|
42
|
+
))}
|
|
43
|
+
</NativePicker>
|
|
44
|
+
);
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
const styles = StyleSheet.create({
|
|
48
|
+
nonIosPicker: {
|
|
49
|
+
opacity: 0,
|
|
50
|
+
position: "absolute",
|
|
51
|
+
top: 0,
|
|
52
|
+
left: 0,
|
|
53
|
+
right: 0,
|
|
54
|
+
bottom: 0,
|
|
55
|
+
width: "100%",
|
|
56
|
+
maxWidth: deviceWidth,
|
|
57
|
+
maxHeight: deviceHeight,
|
|
58
|
+
},
|
|
59
|
+
});
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { View, StyleSheet, Dimensions } from "react-native";
|
|
3
|
+
import { SafeAreaView } from "react-native-safe-area-context";
|
|
4
|
+
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
|
+
import Portal from "../Portal/Portal";
|
|
6
|
+
import Button from "../DeprecatedButton";
|
|
7
|
+
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
8
|
+
export const PickerComponent = ({ Icon, togglePickerVisible, pickerOptions, internalValue, handleValueChange, }) => {
|
|
9
|
+
return (React.createElement(Portal, null,
|
|
10
|
+
React.createElement(View, { style: styles.iosPicker },
|
|
11
|
+
React.createElement(SafeAreaView, { style: styles.iosSafeArea },
|
|
12
|
+
React.createElement(Button, { Icon: Icon, type: "text", onPress: togglePickerVisible, style: styles.iosButton }, "Close"),
|
|
13
|
+
React.createElement(NativePicker, { style: styles.iosNativePicker, selectedValue: internalValue, onValueChange: handleValueChange }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value }))))))));
|
|
14
|
+
};
|
|
15
|
+
const styles = StyleSheet.create({
|
|
16
|
+
iosPicker: {
|
|
17
|
+
position: "absolute",
|
|
18
|
+
bottom: 0,
|
|
19
|
+
left: 0,
|
|
20
|
+
right: 0,
|
|
21
|
+
flexDirection: "row",
|
|
22
|
+
justifyContent: "center",
|
|
23
|
+
width: "100%",
|
|
24
|
+
maxWidth: deviceWidth,
|
|
25
|
+
maxHeight: deviceHeight,
|
|
26
|
+
backgroundColor: "rgba(234, 237, 242, 1)",
|
|
27
|
+
},
|
|
28
|
+
iosSafeArea: {
|
|
29
|
+
backgroundColor: "white",
|
|
30
|
+
flexDirection: "column",
|
|
31
|
+
width: "100%",
|
|
32
|
+
maxWidth: deviceWidth,
|
|
33
|
+
},
|
|
34
|
+
iosButton: {
|
|
35
|
+
alignSelf: "flex-end",
|
|
36
|
+
},
|
|
37
|
+
iosNativePicker: {
|
|
38
|
+
backgroundColor: "white",
|
|
39
|
+
},
|
|
40
|
+
});
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { View, StyleSheet, Dimensions } from "react-native";
|
|
3
|
+
import { SafeAreaView } from "react-native-safe-area-context";
|
|
4
|
+
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
|
+
|
|
6
|
+
import type { IconSlot } from "../../interfaces/Icon";
|
|
7
|
+
import Portal from "../Portal/Portal";
|
|
8
|
+
import Button from "../DeprecatedButton";
|
|
9
|
+
import { PickerOption } from "./Picker";
|
|
10
|
+
|
|
11
|
+
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
12
|
+
|
|
13
|
+
interface PickerComponentProps {
|
|
14
|
+
Icon: IconSlot["Icon"];
|
|
15
|
+
androidPickerRef: React.RefObject<any>;
|
|
16
|
+
togglePickerVisible: () => void;
|
|
17
|
+
pickerOptions: PickerOption[];
|
|
18
|
+
internalValue: string | undefined;
|
|
19
|
+
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export const PickerComponent: React.FC<PickerComponentProps> = ({
|
|
23
|
+
Icon,
|
|
24
|
+
togglePickerVisible,
|
|
25
|
+
pickerOptions,
|
|
26
|
+
internalValue,
|
|
27
|
+
handleValueChange,
|
|
28
|
+
}) => {
|
|
29
|
+
return (
|
|
30
|
+
<Portal>
|
|
31
|
+
<View style={styles.iosPicker}>
|
|
32
|
+
<SafeAreaView style={styles.iosSafeArea}>
|
|
33
|
+
<Button
|
|
34
|
+
Icon={Icon}
|
|
35
|
+
type="text"
|
|
36
|
+
onPress={togglePickerVisible}
|
|
37
|
+
style={styles.iosButton}
|
|
38
|
+
>
|
|
39
|
+
{"Close"}
|
|
40
|
+
</Button>
|
|
41
|
+
|
|
42
|
+
<NativePicker
|
|
43
|
+
style={styles.iosNativePicker}
|
|
44
|
+
selectedValue={internalValue}
|
|
45
|
+
onValueChange={handleValueChange}
|
|
46
|
+
>
|
|
47
|
+
{(pickerOptions as unknown as PickerOption[]).map((option) => (
|
|
48
|
+
<NativePicker.Item
|
|
49
|
+
label={option.label}
|
|
50
|
+
value={option.value}
|
|
51
|
+
key={option.value}
|
|
52
|
+
/>
|
|
53
|
+
))}
|
|
54
|
+
</NativePicker>
|
|
55
|
+
</SafeAreaView>
|
|
56
|
+
</View>
|
|
57
|
+
</Portal>
|
|
58
|
+
);
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
const styles = StyleSheet.create({
|
|
62
|
+
iosPicker: {
|
|
63
|
+
position: "absolute",
|
|
64
|
+
bottom: 0,
|
|
65
|
+
left: 0,
|
|
66
|
+
right: 0,
|
|
67
|
+
flexDirection: "row",
|
|
68
|
+
justifyContent: "center",
|
|
69
|
+
width: "100%",
|
|
70
|
+
maxWidth: deviceWidth,
|
|
71
|
+
maxHeight: deviceHeight,
|
|
72
|
+
backgroundColor: "rgba(234, 237, 242, 1)",
|
|
73
|
+
},
|
|
74
|
+
iosSafeArea: {
|
|
75
|
+
backgroundColor: "white",
|
|
76
|
+
flexDirection: "column",
|
|
77
|
+
width: "100%",
|
|
78
|
+
maxWidth: deviceWidth,
|
|
79
|
+
},
|
|
80
|
+
iosButton: {
|
|
81
|
+
alignSelf: "flex-end",
|
|
82
|
+
},
|
|
83
|
+
iosNativePicker: {
|
|
84
|
+
backgroundColor: "white",
|
|
85
|
+
},
|
|
86
|
+
});
|