@draftbit/core 46.1.4 → 46.2.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/Carousel.js +3 -1
- package/lib/commonjs/components/Carousel.js.map +1 -1
- package/lib/commonjs/components/Config.js +3 -3
- package/lib/commonjs/components/Config.js.map +1 -1
- package/lib/commonjs/components/DatePicker/DatePicker.js +3 -3
- package/lib/commonjs/components/DatePicker/DatePicker.js.map +1 -1
- package/lib/commonjs/components/DeprecatedButton.js +20 -4
- package/lib/commonjs/components/DeprecatedButton.js.map +1 -1
- package/lib/commonjs/components/DeprecatedCardWrapper.js +14 -2
- package/lib/commonjs/components/DeprecatedCardWrapper.js.map +1 -1
- package/lib/commonjs/components/Justification.js +3 -0
- package/lib/commonjs/components/Picker/Picker.js +4 -5
- package/lib/commonjs/components/Picker/Picker.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.android.js +2 -2
- package/lib/commonjs/components/Picker/PickerComponent.android.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +2 -2
- package/lib/commonjs/components/Picker/PickerComponent.ios.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.web.js +2 -2
- package/lib/commonjs/components/Picker/PickerComponent.web.js.map +1 -1
- package/lib/commonjs/components/RadioButton/RadioButton.js +1 -1
- package/lib/commonjs/components/RadioButton/RadioButton.js.map +1 -1
- package/lib/commonjs/components/RadioButton/RadioButtonRow.js +1 -1
- package/lib/commonjs/components/RadioButton/RadioButtonRow.js.map +1 -1
- package/lib/commonjs/components/ResizeMode.js +3 -0
- package/lib/commonjs/components/StepIndicator.js +1 -1
- package/lib/commonjs/components/StepIndicator.js.map +1 -1
- package/lib/commonjs/components/Stepper.js +1 -1
- package/lib/commonjs/components/Stepper.js.map +1 -1
- package/lib/commonjs/mappings/ActionSheetItem.js.map +1 -1
- package/lib/commonjs/mappings/BlurView.js.map +1 -1
- package/lib/commonjs/mappings/RadioButtonGroup.js.map +1 -1
- package/lib/commonjs/mappings/RadioButtonRow.js.map +1 -1
- package/lib/commonjs/utilities.js +1 -1
- package/lib/commonjs/utilities.js.map +1 -1
- package/lib/module/components/Carousel.js +3 -1
- package/lib/module/components/Carousel.js.map +1 -1
- package/lib/module/components/Config.js +3 -3
- package/lib/module/components/Config.js.map +1 -1
- package/lib/module/components/DatePicker/DatePicker.js +3 -3
- package/lib/module/components/DatePicker/DatePicker.js.map +1 -1
- package/lib/module/components/Justification.js +1 -1
- package/lib/module/components/Picker/Picker.js +4 -5
- package/lib/module/components/Picker/Picker.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.android.js +2 -2
- package/lib/module/components/Picker/PickerComponent.android.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.ios.js +2 -2
- package/lib/module/components/Picker/PickerComponent.ios.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.web.js +2 -2
- package/lib/module/components/Picker/PickerComponent.web.js.map +1 -1
- package/lib/module/components/RadioButton/RadioButton.js +1 -1
- package/lib/module/components/RadioButton/RadioButton.js.map +1 -1
- package/lib/module/components/RadioButton/RadioButtonRow.js +1 -1
- package/lib/module/components/RadioButton/RadioButtonRow.js.map +1 -1
- package/lib/module/components/ResizeMode.js +1 -1
- package/lib/module/components/StepIndicator.js +1 -1
- package/lib/module/components/StepIndicator.js.map +1 -1
- package/lib/module/components/Stepper.js +1 -1
- package/lib/module/components/Stepper.js.map +1 -1
- package/lib/module/utilities.js +1 -1
- package/lib/module/utilities.js.map +1 -1
- package/package.json +2 -2
- package/src/Provider.js +9 -0
- package/src/components/Accordion/AccordionGroup.js +44 -0
- package/src/components/Accordion/AccordionItem.js +32 -0
- package/src/components/Accordion/index.js +2 -0
- package/src/components/ActionSheet/ActionSheet.js +45 -0
- package/src/components/ActionSheet/ActionSheetCancel.js +6 -0
- package/src/components/ActionSheet/ActionSheetItem.js +30 -0
- package/src/components/ActionSheet/index.js +3 -0
- package/src/components/AnimatedCircularProgress.js +43 -0
- package/src/components/AspectRatio.js +18 -0
- package/src/components/AvatarEdit.js +30 -0
- package/src/components/Banner.js +109 -0
- package/src/components/Button.js +112 -0
- package/src/components/Card.js +57 -0
- package/src/components/CardBlock.js +54 -0
- package/src/components/CardContainer.js +69 -0
- package/src/components/CardContainerRating.js +79 -0
- package/src/components/CardContainerShortImage.js +33 -0
- package/src/components/CardInline.js +36 -0
- package/src/components/Carousel.js +68 -0
- package/src/components/Checkbox/Checkbox.js +63 -0
- package/src/components/Checkbox/CheckboxGroup.js +21 -0
- package/src/components/Checkbox/CheckboxGroupRow.js +77 -0
- package/src/components/Checkbox/CheckboxRow.js +78 -0
- package/src/components/Checkbox/context.js +14 -0
- package/src/components/Checkbox/index.js +3 -0
- package/src/components/CircleImage.js +8 -0
- package/src/components/CircularProgress.js +81 -0
- package/src/components/Config.js +63 -0
- package/src/components/Container.js +43 -0
- package/src/components/DatePicker/DatePicker.js +368 -0
- package/src/components/DatePicker/DatePickerComponent.js +13 -0
- package/src/components/DatePicker/DatePickerComponent.web.js +30 -0
- package/src/components/DatePicker/DatePickerComponentType.js +1 -0
- package/src/components/DeprecatedButton.js +95 -0
- package/src/components/DeprecatedCardWrapper.js +18 -0
- package/src/components/DeprecatedFAB.js +115 -0
- package/src/components/Divider.js +13 -0
- package/src/components/Elevation.js +20 -0
- package/src/components/FAB.js +46 -0
- package/src/components/FieldSearchBarFull.js +53 -0
- package/src/components/FormRow.js +19 -0
- package/src/components/Header.js +44 -0
- package/src/components/HeaderLarge.js +7 -0
- package/src/components/HeaderMedium.js +7 -0
- package/src/components/HeaderOverline.js +7 -0
- package/src/components/IconButton.js +35 -0
- package/src/components/Image.js +47 -0
- package/src/components/Justification.js +1 -0
- package/src/components/Layout.js +50 -0
- package/src/components/NumberInput.js +49 -0
- package/src/components/Picker/Picker.js +267 -0
- package/src/components/Picker/Picker.tsx +8 -6
- package/src/components/Picker/PickerComponent.android.js +69 -0
- package/src/components/Picker/PickerComponent.ios.js +79 -0
- package/src/components/Picker/PickerComponent.web.js +70 -0
- package/src/components/Picker/PickerTypes.js +1 -0
- package/src/components/Portal/Portal.js +35 -0
- package/src/components/Portal/PortalConsumer.js +27 -0
- package/src/components/Portal/PortalHost.js +107 -0
- package/src/components/Portal/PortalManager.js +32 -0
- package/src/components/ProgressBar.js +118 -0
- package/src/components/ProgressCircle.js +13 -0
- package/src/components/ProgressIndicator.js +27 -0
- package/src/components/RadioButton/RadioButton.js +17 -0
- package/src/components/RadioButton/RadioButtonFieldGroup.js +17 -0
- package/src/components/RadioButton/RadioButtonGroup.js +43 -0
- package/src/components/RadioButton/RadioButtonRow.js +76 -0
- package/src/components/RadioButton/context.js +14 -0
- package/src/components/RadioButton/index.js +4 -0
- package/src/components/ResizeMode.js +1 -0
- package/src/components/Row.js +48 -0
- package/src/components/RowBodyIcon.js +8 -0
- package/src/components/RowHeadlineImageCaption.js +12 -0
- package/src/components/RowHeadlineImageIcon.js +14 -0
- package/src/components/ScreenContainer.js +34 -0
- package/src/components/Slider.js +63 -0
- package/src/components/StarRating.js +50 -0
- package/src/components/StepIndicator.js +346 -0
- package/src/components/Stepper.js +39 -0
- package/src/components/Surface.js +32 -0
- package/src/components/Swiper/Swiper.js +29 -0
- package/src/components/Swiper/SwiperItem.js +9 -0
- package/src/components/Swiper/index.js +2 -0
- package/src/components/Switch.js +56 -0
- package/src/components/Text.js +27 -0
- package/src/components/TextField.js +423 -0
- package/src/components/ToggleButton.js +39 -0
- package/src/components/Touchable.js +12 -0
- package/src/components/Touchable.web.js +2 -0
- package/src/components/Typography.js +36 -0
- package/src/components/useAuthState.js +31 -0
- package/src/constants.js +10 -0
- package/src/hooks.js +12 -0
- package/src/index.js +52 -0
- package/src/interfaces/Icon.js +8 -0
- package/src/mappings/Accordion.js +41 -0
- package/src/mappings/AccordionItem.js +16 -0
- package/src/mappings/ActionSheet.js +13 -0
- package/src/mappings/ActionSheetCancel.js +19 -0
- package/src/mappings/ActionSheetItem.js +23 -0
- package/src/mappings/ActivityIndicator.js +53 -0
- package/src/mappings/AudioPlayer.js +20 -0
- package/src/mappings/AvatarEdit.js +37 -0
- package/src/mappings/Banner.js +32 -0
- package/src/mappings/BlurView.js +41 -0
- package/src/mappings/Button.js +56 -0
- package/src/mappings/Card.js +52 -0
- package/src/mappings/CardBlock.js +122 -0
- package/src/mappings/CardContainer.js +102 -0
- package/src/mappings/CardContainerRating.js +124 -0
- package/src/mappings/CardContainerShortImage.js +118 -0
- package/src/mappings/CardInline.js +51 -0
- package/src/mappings/Carousel.js +18 -0
- package/src/mappings/Checkbox.js +45 -0
- package/src/mappings/CheckboxGroup.js +25 -0
- package/src/mappings/CheckboxRow.js +56 -0
- package/src/mappings/CircleImage.js +24 -0
- package/src/mappings/Container.js +29 -0
- package/src/mappings/CustomCode.js +8 -0
- package/src/mappings/DatePicker.js +147 -0
- package/src/mappings/Divider.js +26 -0
- package/src/mappings/FAB.js +36 -0
- package/src/mappings/Fetch.js +12 -0
- package/src/mappings/FieldSearchBarFull.js +49 -0
- package/src/mappings/FlatList.js +19 -0
- package/src/mappings/HeaderLarge.js +28 -0
- package/src/mappings/HeaderMedium.js +54 -0
- package/src/mappings/HeaderOverline.js +54 -0
- package/src/mappings/Icon.js +25 -0
- package/src/mappings/IconButton.js +30 -0
- package/src/mappings/Image.js +15 -0
- package/src/mappings/ImageBackground.js +28 -0
- package/src/mappings/KeyboardAvoidingView.js +40 -0
- package/src/mappings/KeyboardAwareScrollView.js +49 -0
- package/src/mappings/Layout.js +195 -0
- package/src/mappings/LinearGradient.js +77 -0
- package/src/mappings/MapCallout.js +21 -0
- package/src/mappings/MapMarker.js +47 -0
- package/src/mappings/MapView.js +138 -0
- package/src/mappings/Modal.js +41 -0
- package/src/mappings/Picker.js +139 -0
- package/src/mappings/ProgressBar.js +100 -0
- package/src/mappings/ProgressCircle.js +108 -0
- package/src/mappings/ProgressIndicator.js +180 -0
- package/src/mappings/RadioButton.js +50 -0
- package/src/mappings/RadioButtonGroup.js +16 -0
- package/src/mappings/RadioButtonRow.js +37 -0
- package/src/mappings/RowBodyIcon.js +75 -0
- package/src/mappings/RowHeadlineImageCaption.js +167 -0
- package/src/mappings/RowHeadlineImageIcon.js +99 -0
- package/src/mappings/SafeAreaView.js +33 -0
- package/src/mappings/ScrollView.js +30 -0
- package/src/mappings/Slider.js +59 -0
- package/src/mappings/StarRating.js +42 -0
- package/src/mappings/Stepper.js +28 -0
- package/src/mappings/Surface.js +13 -0
- package/src/mappings/Swiper.js +60 -0
- package/src/mappings/SwiperItem.js +8 -0
- package/src/mappings/Switch.js +75 -0
- package/src/mappings/Text.js +232 -0
- package/src/mappings/TextArea.js +52 -0
- package/src/mappings/TextField.js +158 -0
- package/src/mappings/TextInput.js +208 -0
- package/src/mappings/ToggleButton.js +45 -0
- package/src/mappings/Touchable.js +12 -0
- package/src/mappings/Video.js +74 -0
- package/src/mappings/View.js +206 -0
- package/src/mappings/WebView.js +18 -0
- package/src/styles/DarkTheme.js +26 -0
- package/src/styles/DefaultTheme.js +111 -0
- package/src/styles/fonts.js +62 -0
- package/src/styles/overlay.js +60 -0
- package/src/styles/shadow.js +51 -0
- package/src/theming.js +3 -0
- package/src/utilities.js +102 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","View","StyleSheet","Picker","NativePicker","omit","withTheme","extractStyles","TextField","Touchable","style","options","placeholder","selectedValue","disabled","onValueChange","onValueChangeOverride","props","viewStyles","borderRadius","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderColor","backgroundColor","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","textField","useRef","undefined","itemValue","itemIndex","toggleFocus","current","stylesWithoutMargin","flatten","selectedLabel","find","o","value","label","styles","container","flex","opacity","position","top","left","right","bottom","width","map","create","alignSelf"],"sources":["PickerComponent.web.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { View, StyleSheet } from \"react-native\";\nimport { Picker as NativePicker } from \"@react-native-picker/picker\";\nimport omit from \"lodash.omit\";\nimport { withTheme } from \"../../theming\";\nimport { extractStyles } from \"../../utilities\";\n\nimport TextField from \"../TextField\";\nimport Touchable from \"../Touchable\";\nimport { PickerComponentProps } from \"./PickerTypes\";\n\nconst Picker: React.FC<PickerComponentProps> = ({\n style,\n options,\n placeholder,\n selectedValue,\n disabled = false,\n onValueChange: onValueChangeOverride = () => {},\n ...props\n}) => {\n const {\n viewStyles: {\n borderRadius, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderTopWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderRightWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderBottomWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderLeftWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n backgroundColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n padding, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingTop, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingRight, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingBottom, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingLeft, // eslint-disable-line @typescript-eslint/no-unused-vars\n ...viewStyles\n },\n } = extractStyles(style);\n\n const textField = React.useRef<typeof TextField | undefined>(undefined);\n\n const onValueChange = (itemValue: string, itemIndex: number) => {\n toggleFocus();\n onValueChangeOverride(itemValue, itemIndex);\n };\n\n const toggleFocus = () => {\n if (!disabled) {\n // @ts-ignore\n textField.current.toggleFocus(); // cannot determine if method exists due to component being wrapped in a withTheme()\n }\n };\n\n const stylesWithoutMargin =\n style &&\n omit(StyleSheet.flatten(style), [\n \"margin\",\n \"marginTop\",\n \"marginRight\",\n \"marginBottom\",\n \"marginLeft\",\n ]);\n\n const selectedLabel =\n selectedValue &&\n (options.find((o) => o.value === selectedValue)?.label ?? selectedValue);\n\n return (\n <Touchable\n disabled={disabled}\n onPress={toggleFocus}\n style={[styles.container, viewStyles]}\n >\n <View>\n <NativePicker\n enabled={!disabled}\n selectedValue={selectedValue}\n onValueChange={onValueChange}\n style={{\n flex: 1,\n opacity: 0,\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n width: \"100%\",\n }}\n >\n {options.map((o) => (\n <NativePicker.Item label={o.label} value={o.value} key={o.value} />\n ))}\n </NativePicker>\n <View pointerEvents=\"none\">\n <TextField\n {...props}\n value={selectedLabel}\n placeholder={placeholder}\n // @ts-ignore\n ref={textField} // cannot determine if ref is of correct type due to component being wrapped in a withTheme()\n disabled={disabled}\n // @ts-expect-error\n style={stylesWithoutMargin}\n />\n </View>\n </View>\n </Touchable>\n );\n};\n\nconst styles = StyleSheet.create({\n container: {\n alignSelf: \"stretch\",\n },\n});\n\nexport default withTheme(Picker);\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,IAAT,EAAeC,UAAf,QAAiC,cAAjC;AACA,SAASC,MAAM,IAAIC,YAAnB,QAAuC,6BAAvC;AACA,OAAOC,IAAP,MAAiB,aAAjB;AACA,SAASC,SAAT,QAA0B,eAA1B;AACA,SAASC,aAAT,QAA8B,iBAA9B;AAEA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;;AAGA,MAAMN,MAAsC,GAAG,QAQzC;EAAA;;EAAA,IAR0C;IAC9CO,KAD8C;IAE9CC,OAF8C;IAG9CC,WAH8C;IAI9CC,aAJ8C;IAK9CC,QAAQ,GAAG,KALmC;IAM9CC,aAAa,EAAEC,qBAAqB,GAAG,MAAM,CAAE,CAND;IAO9C,GAAGC;EAP2C,CAQ1C;EACJ,MAAM;IACJC,UAAU,EAAE;MACVC,YADU;MACI;MACdC,WAFU;MAEG;MACbC,cAHU;MAGM;MAChBC,gBAJU;MAIQ;MAClBC,iBALU;MAKS;MACnBC,eANU;MAMO;MACjBC,WAPU;MAOG;MACbC,eARU;MAQO;MACjBC,OATU;MASD;MACTC,UAVU;MAUE;MACZC,YAXU;MAWI;MACdC,aAZU;MAYK;MACfC,WAbU;MAaG;MACb,GAAGb;IAdO;EADR,IAiBFX,aAAa,CAACG,KAAD,CAjBjB;EAmBA,MAAMsB,SAAS,GAAGhC,KAAK,CAACiC,MAAN,CAA2CC,SAA3C,CAAlB;;EAEA,MAAMnB,aAAa,GAAG,CAACoB,SAAD,EAAoBC,SAApB,KAA0C;IAC9DC,WAAW;IACXrB,qBAAqB,CAACmB,SAAD,EAAYC,SAAZ,CAArB;EACD,CAHD;;EAKA,MAAMC,WAAW,GAAG,MAAM;IACxB,IAAI,CAACvB,QAAL,EAAe;MACb;MACAkB,SAAS,CAACM,OAAV,CAAkBD,WAAlB,GAFa,CAEoB;IAClC;EACF,CALD;;EAOA,MAAME,mBAAmB,GACvB7B,KAAK,IACLL,IAAI,CAACH,UAAU,CAACsC,OAAX,CAAmB9B,KAAnB,CAAD,EAA4B,CAC9B,QAD8B,EAE9B,WAF8B,EAG9B,aAH8B,EAI9B,cAJ8B,EAK9B,YAL8B,CAA5B,CAFN;EAUA,MAAM+B,aAAa,GACjB5B,aAAa,
|
|
1
|
+
{"version":3,"names":["React","View","StyleSheet","Picker","NativePicker","omit","withTheme","extractStyles","TextField","Touchable","style","options","placeholder","selectedValue","disabled","onValueChange","onValueChangeOverride","props","viewStyles","borderRadius","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderColor","backgroundColor","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","textField","useRef","undefined","itemValue","itemIndex","toggleFocus","current","stylesWithoutMargin","flatten","selectedLabel","find","o","value","label","styles","container","flex","opacity","position","top","left","right","bottom","width","map","create","alignSelf"],"sources":["PickerComponent.web.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { View, StyleSheet } from \"react-native\";\nimport { Picker as NativePicker } from \"@react-native-picker/picker\";\nimport omit from \"lodash.omit\";\nimport { withTheme } from \"../../theming\";\nimport { extractStyles } from \"../../utilities\";\n\nimport TextField from \"../TextField\";\nimport Touchable from \"../Touchable\";\nimport { PickerComponentProps } from \"./PickerTypes\";\n\nconst Picker: React.FC<PickerComponentProps> = ({\n style,\n options,\n placeholder,\n selectedValue,\n disabled = false,\n onValueChange: onValueChangeOverride = () => {},\n ...props\n}) => {\n const {\n viewStyles: {\n borderRadius, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderTopWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderRightWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderBottomWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderLeftWidth, // eslint-disable-line @typescript-eslint/no-unused-vars\n borderColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n backgroundColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n padding, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingTop, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingRight, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingBottom, // eslint-disable-line @typescript-eslint/no-unused-vars\n paddingLeft, // eslint-disable-line @typescript-eslint/no-unused-vars\n ...viewStyles\n },\n } = extractStyles(style);\n\n const textField = React.useRef<typeof TextField | undefined>(undefined);\n\n const onValueChange = (itemValue: string, itemIndex: number) => {\n toggleFocus();\n onValueChangeOverride(itemValue, itemIndex);\n };\n\n const toggleFocus = () => {\n if (!disabled) {\n // @ts-ignore\n textField.current.toggleFocus(); // cannot determine if method exists due to component being wrapped in a withTheme()\n }\n };\n\n const stylesWithoutMargin =\n style &&\n omit(StyleSheet.flatten(style), [\n \"margin\",\n \"marginTop\",\n \"marginRight\",\n \"marginBottom\",\n \"marginLeft\",\n ]);\n\n const selectedLabel =\n selectedValue &&\n (options.find((o) => o.value === selectedValue)?.label ?? selectedValue);\n\n return (\n <Touchable\n disabled={disabled}\n onPress={toggleFocus}\n style={[styles.container, viewStyles]}\n >\n <View>\n <NativePicker\n enabled={!disabled}\n selectedValue={selectedValue}\n onValueChange={onValueChange}\n style={{\n flex: 1,\n opacity: 0,\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n width: \"100%\",\n }}\n >\n {options.map((o) => (\n <NativePicker.Item label={o.label} value={o.value} key={o.value} />\n ))}\n </NativePicker>\n <View pointerEvents=\"none\">\n <TextField\n {...props}\n value={selectedLabel}\n placeholder={placeholder}\n // @ts-ignore\n ref={textField} // cannot determine if ref is of correct type due to component being wrapped in a withTheme()\n disabled={disabled}\n // @ts-expect-error\n style={stylesWithoutMargin}\n />\n </View>\n </View>\n </Touchable>\n );\n};\n\nconst styles = StyleSheet.create({\n container: {\n alignSelf: \"stretch\",\n },\n});\n\nexport default withTheme(Picker);\n"],"mappings":"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"}
|
|
@@ -27,7 +27,7 @@ const RadioButton = _ref => {
|
|
|
27
27
|
} = useRadioButtonGroupContext();
|
|
28
28
|
const realValue = getValueForRadioButton(value);
|
|
29
29
|
const realContextValue = getValueForRadioButton(contextValue);
|
|
30
|
-
const isSelected = selected
|
|
30
|
+
const isSelected = selected !== null && selected !== void 0 ? selected : realContextValue === realValue;
|
|
31
31
|
|
|
32
32
|
const handlePress = () => {
|
|
33
33
|
onPress === null || onPress === void 0 ? void 0 : onPress(realValue);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Config","IconButton","getValueForRadioButton","useRadioButtonGroupContext","RadioButton","Icon","disabled","color","value","selected","unselectedColor","onPress","size","radioButtonSize","selectedIcon","unselectedIcon","style","rest","contextValue","onValueChange","realValue","realContextValue","isSelected","handlePress"],"sources":["RadioButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { StyleProp, ViewStyle } from \"react-native\";\n\nimport Config from \"../Config\";\nimport IconButton from \"../IconButton\";\nimport { getValueForRadioButton } from \"../../utilities\";\nimport { useRadioButtonGroupContext } from \"./context\";\n\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\nexport type RadioButtonProps = {\n selected?: boolean;\n disabled?: boolean;\n color?: string;\n value?: string | number;\n unselectedColor?: string;\n onPress?: (value?: string) => void;\n style?: StyleProp<ViewStyle>;\n size?: number;\n selectedIcon?: string;\n unselectedIcon?: string;\n} & IconSlot;\n\nconst RadioButton: React.FC<RadioButtonProps> = ({\n Icon,\n disabled = false,\n color,\n value = \"\",\n selected,\n unselectedColor,\n onPress,\n size = Config.radioButtonSize,\n selectedIcon = \"MaterialIcons/radio-button-checked\",\n unselectedIcon = \"MaterialIcons/radio-button-unchecked\",\n style,\n ...rest\n}) => {\n const { value: contextValue, onValueChange } = useRadioButtonGroupContext();\n\n const realValue = getValueForRadioButton(value);\n const realContextValue = getValueForRadioButton(contextValue);\n const isSelected = selected ?? realContextValue === realValue;\n\n const handlePress = () => {\n onPress?.(realValue);\n onValueChange?.(realValue);\n };\n\n return (\n <IconButton\n Icon={Icon}\n icon={isSelected ? selectedIcon : unselectedIcon}\n color={isSelected ? color : unselectedColor}\n disabled={disabled}\n onPress={handlePress}\n size={size}\n style={style}\n {...rest}\n />\n );\n};\n\nexport default RadioButton;\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAGA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,sBAAT,QAAuC,iBAAvC;AACA,SAASC,0BAAT,QAA2C,WAA3C;;AAiBA,MAAMC,WAAuC,GAAG,QAa1C;EAAA,IAb2C;IAC/CC,IAD+C;IAE/CC,QAAQ,GAAG,KAFoC;IAG/CC,KAH+C;IAI/CC,KAAK,GAAG,EAJuC;IAK/CC,QAL+C;IAM/CC,eAN+C;IAO/CC,OAP+C;IAQ/CC,IAAI,GAAGZ,MAAM,CAACa,eARiC;IAS/CC,YAAY,GAAG,oCATgC;IAU/CC,cAAc,GAAG,sCAV8B;IAW/CC,KAX+C;IAY/C,GAAGC;EAZ4C,CAa3C;EACJ,MAAM;IAAET,KAAK,EAAEU,YAAT;IAAuBC;EAAvB,IAAyChB,0BAA0B,EAAzE;EAEA,MAAMiB,SAAS,GAAGlB,sBAAsB,CAACM,KAAD,CAAxC;EACA,MAAMa,gBAAgB,GAAGnB,sBAAsB,CAACgB,YAAD,CAA/C;EACA,MAAMI,UAAU,GAAGb,
|
|
1
|
+
{"version":3,"names":["React","Config","IconButton","getValueForRadioButton","useRadioButtonGroupContext","RadioButton","Icon","disabled","color","value","selected","unselectedColor","onPress","size","radioButtonSize","selectedIcon","unselectedIcon","style","rest","contextValue","onValueChange","realValue","realContextValue","isSelected","handlePress"],"sources":["RadioButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { StyleProp, ViewStyle } from \"react-native\";\n\nimport Config from \"../Config\";\nimport IconButton from \"../IconButton\";\nimport { getValueForRadioButton } from \"../../utilities\";\nimport { useRadioButtonGroupContext } from \"./context\";\n\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\nexport type RadioButtonProps = {\n selected?: boolean;\n disabled?: boolean;\n color?: string;\n value?: string | number;\n unselectedColor?: string;\n onPress?: (value?: string) => void;\n style?: StyleProp<ViewStyle>;\n size?: number;\n selectedIcon?: string;\n unselectedIcon?: string;\n} & IconSlot;\n\nconst RadioButton: React.FC<RadioButtonProps> = ({\n Icon,\n disabled = false,\n color,\n value = \"\",\n selected,\n unselectedColor,\n onPress,\n size = Config.radioButtonSize,\n selectedIcon = \"MaterialIcons/radio-button-checked\",\n unselectedIcon = \"MaterialIcons/radio-button-unchecked\",\n style,\n ...rest\n}) => {\n const { value: contextValue, onValueChange } = useRadioButtonGroupContext();\n\n const realValue = getValueForRadioButton(value);\n const realContextValue = getValueForRadioButton(contextValue);\n const isSelected = selected ?? realContextValue === realValue;\n\n const handlePress = () => {\n onPress?.(realValue);\n onValueChange?.(realValue);\n };\n\n return (\n <IconButton\n Icon={Icon}\n icon={isSelected ? selectedIcon : unselectedIcon}\n color={isSelected ? color : unselectedColor}\n disabled={disabled}\n onPress={handlePress}\n size={size}\n style={style}\n {...rest}\n />\n );\n};\n\nexport default RadioButton;\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAGA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,sBAAT,QAAuC,iBAAvC;AACA,SAASC,0BAAT,QAA2C,WAA3C;;AAiBA,MAAMC,WAAuC,GAAG,QAa1C;EAAA,IAb2C;IAC/CC,IAD+C;IAE/CC,QAAQ,GAAG,KAFoC;IAG/CC,KAH+C;IAI/CC,KAAK,GAAG,EAJuC;IAK/CC,QAL+C;IAM/CC,eAN+C;IAO/CC,OAP+C;IAQ/CC,IAAI,GAAGZ,MAAM,CAACa,eARiC;IAS/CC,YAAY,GAAG,oCATgC;IAU/CC,cAAc,GAAG,sCAV8B;IAW/CC,KAX+C;IAY/C,GAAGC;EAZ4C,CAa3C;EACJ,MAAM;IAAET,KAAK,EAAEU,YAAT;IAAuBC;EAAvB,IAAyChB,0BAA0B,EAAzE;EAEA,MAAMiB,SAAS,GAAGlB,sBAAsB,CAACM,KAAD,CAAxC;EACA,MAAMa,gBAAgB,GAAGnB,sBAAsB,CAACgB,YAAD,CAA/C;EACA,MAAMI,UAAU,GAAGb,QAAH,aAAGA,QAAH,cAAGA,QAAH,GAAeY,gBAAgB,KAAKD,SAApD;;EAEA,MAAMG,WAAW,GAAG,MAAM;IACxBZ,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAGS,SAAH,CAAP;IACAD,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGC,SAAH,CAAb;EACD,CAHD;;EAKA,oBACE,oBAAC,UAAD;IACE,IAAI,EAAEf,IADR;IAEE,IAAI,EAAEiB,UAAU,GAAGR,YAAH,GAAkBC,cAFpC;IAGE,KAAK,EAAEO,UAAU,GAAGf,KAAH,GAAWG,eAH9B;IAIE,QAAQ,EAAEJ,QAJZ;IAKE,OAAO,EAAEiB,WALX;IAME,IAAI,EAAEX,IANR;IAOE,KAAK,EAAEI;EAPT,GAQMC,IARN,EADF;AAYD,CArCD;;AAuCA,eAAeb,WAAf"}
|
|
@@ -59,7 +59,7 @@ const RadioButtonRow = _ref => {
|
|
|
59
59
|
} = useRadioButtonGroupContext();
|
|
60
60
|
const realValue = getValueForRadioButton(value);
|
|
61
61
|
const realContextValue = getValueForRadioButton(contextValue);
|
|
62
|
-
const isSelected = selected
|
|
62
|
+
const isSelected = selected !== null && selected !== void 0 ? selected : realContextValue === realValue;
|
|
63
63
|
|
|
64
64
|
const handlePress = () => {
|
|
65
65
|
onPress === null || onPress === void 0 ? void 0 : onPress(realValue);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","StyleSheet","View","Platform","RadioButton","Text","useRadioButtonGroupContext","Direction","GroupDirection","Touchable","extractStyles","getValueForRadioButton","getRadioButtonAlignment","parentDirection","direction","Horizontal","Row","RowReverse","renderLabel","value","labelStyle","textStyle","RadioButtonRow","Icon","label","color","unselectedColor","onPress","labelContainerStyle","radioButtonStyle","selected","disabled","style","rest","contextValue","onValueChange","realValue","realContextValue","isSelected","handlePress","textStyles","viewStyles","styles","mainParent","flexDirection","alignItems","flex","create","justifyContent","paddingStart","minHeight","paddingEnd","display","select","web","cursor","userSelect"],"sources":["RadioButtonRow.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n StyleProp,\n ViewStyle,\n StyleSheet,\n TextStyle,\n View,\n Platform,\n} from \"react-native\";\nimport RadioButton, { RadioButtonProps } from \"./RadioButton\";\nimport Text from \"../Text\";\nimport { useRadioButtonGroupContext } from \"./context\";\nimport type { IconSlot } from \"../../interfaces/Icon\";\nimport { Direction as GroupDirection } from \"./context\";\nimport Touchable from \"../Touchable\";\nimport { extractStyles, getValueForRadioButton } from \"../../utilities\";\n\nexport enum Direction {\n Row = \"row\",\n RowReverse = \"row-reverse\",\n}\n\nexport interface RadioButtonRowProps extends Omit<RadioButtonProps, \"onPress\"> {\n label: string | React.ReactNode;\n value: string | number; // A string (or number that will be parsed String(number)) that this radio button row represents when selected\n color?: string;\n unselectedColor?: string;\n labelContainerStyle: StyleProp<ViewStyle>;\n radioButtonStyle?: StyleProp<ViewStyle>;\n labelStyle?: StyleProp<TextStyle>;\n onPress?: (value: string) => void;\n direction?: Direction;\n}\n\nconst getRadioButtonAlignment = (\n parentDirection: GroupDirection | undefined,\n direction: Direction\n) => {\n if (parentDirection === GroupDirection.Horizontal) {\n return direction === Direction.Row ? \"flex-start\" : \"flex-end\";\n } else if (direction === Direction.RowReverse) {\n return \"flex-start\";\n } else {\n return \"flex-end\";\n }\n};\n\nconst renderLabel = (\n value: string | React.ReactNode,\n labelStyle: StyleProp<TextStyle>,\n textStyle: StyleProp<TextStyle>\n) => {\n if (typeof value === \"string\") {\n return <Text style={[labelStyle, textStyle]}>{value}</Text>;\n } else {\n return <>{value}</>;\n }\n};\n\nconst RadioButtonRow: React.FC<RadioButtonRowProps & IconSlot> = ({\n Icon,\n label,\n value = \"\",\n color,\n unselectedColor,\n onPress,\n labelContainerStyle,\n labelStyle,\n radioButtonStyle,\n direction = Direction.Row,\n selected,\n disabled,\n style,\n ...rest\n}) => {\n const {\n value: contextValue,\n onValueChange,\n direction: parentDirection,\n } = useRadioButtonGroupContext();\n\n const realValue = getValueForRadioButton(value);\n const realContextValue = getValueForRadioButton(contextValue);\n const isSelected = selected ?? realContextValue === realValue;\n\n const handlePress = () => {\n onPress?.(realValue);\n onValueChange?.(realValue);\n };\n\n const { textStyles, viewStyles } = extractStyles(style);\n\n return (\n <Touchable\n onPress={handlePress}\n style={[styles.mainParent, { flexDirection: direction }, viewStyles]}\n disabled={disabled}\n {...rest}\n >\n <View\n style={[\n styles.label,\n {\n alignItems: direction === Direction.Row ? \"flex-start\" : \"flex-end\",\n },\n labelContainerStyle,\n ]}\n >\n {renderLabel(label, labelStyle, textStyles)}\n </View>\n <View\n style={{\n flex: 1,\n alignItems: getRadioButtonAlignment(parentDirection, direction),\n }}\n >\n <RadioButton\n Icon={Icon}\n selected={isSelected}\n value={realValue}\n color={color}\n unselectedColor={unselectedColor}\n style={radioButtonStyle}\n />\n </View>\n </Touchable>\n );\n};\n\nconst styles = StyleSheet.create({\n mainParent: {\n alignItems: \"center\",\n justifyContent: \"space-around\",\n paddingStart: 20,\n minHeight: 50,\n paddingEnd: 20,\n display: \"flex\",\n ...Platform.select({\n web: {\n cursor: \"pointer\",\n userSelect: \"none\",\n },\n }),\n },\n label: {\n flex: 3,\n },\n});\n\nexport default RadioButtonRow;\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAGEC,UAHF,EAKEC,IALF,EAMEC,QANF,QAOO,cAPP;AAQA,OAAOC,WAAP,MAA8C,eAA9C;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,SAASC,0BAAT,QAA2C,WAA3C;AAEA,SAASC,SAAS,IAAIC,cAAtB,QAA4C,WAA5C;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,SAASC,aAAT,EAAwBC,sBAAxB,QAAsD,iBAAtD;AAEA,WAAYJ,SAAZ;;WAAYA,S;EAAAA,S;EAAAA,S;GAAAA,S,KAAAA,S;;AAiBZ,MAAMK,uBAAuB,GAAG,CAC9BC,eAD8B,EAE9BC,SAF8B,KAG3B;EACH,IAAID,eAAe,KAAKL,cAAc,CAACO,UAAvC,EAAmD;IACjD,OAAOD,SAAS,KAAKP,SAAS,CAACS,GAAxB,GAA8B,YAA9B,GAA6C,UAApD;EACD,CAFD,MAEO,IAAIF,SAAS,KAAKP,SAAS,CAACU,UAA5B,EAAwC;IAC7C,OAAO,YAAP;EACD,CAFM,MAEA;IACL,OAAO,UAAP;EACD;AACF,CAXD;;AAaA,MAAMC,WAAW,GAAG,CAClBC,KADkB,EAElBC,UAFkB,EAGlBC,SAHkB,KAIf;EACH,IAAI,OAAOF,KAAP,KAAiB,QAArB,EAA+B;IAC7B,oBAAO,oBAAC,IAAD;MAAM,KAAK,EAAE,CAACC,UAAD,EAAaC,SAAb;IAAb,GAAuCF,KAAvC,CAAP;EACD,CAFD,MAEO;IACL,oBAAO,0CAAGA,KAAH,CAAP;EACD;AACF,CAVD;;AAYA,MAAMG,cAAwD,GAAG,QAe3D;EAAA,IAf4D;IAChEC,IADgE;IAEhEC,KAFgE;IAGhEL,KAAK,GAAG,EAHwD;IAIhEM,KAJgE;IAKhEC,eALgE;IAMhEC,OANgE;IAOhEC,mBAPgE;IAQhER,UARgE;IAShES,gBATgE;IAUhEf,SAAS,GAAGP,SAAS,CAACS,GAV0C;IAWhEc,QAXgE;IAYhEC,QAZgE;IAahEC,KAbgE;IAchE,GAAGC;EAd6D,CAe5D;EACJ,MAAM;IACJd,KAAK,EAAEe,YADH;IAEJC,aAFI;IAGJrB,SAAS,EAAED;EAHP,IAIFP,0BAA0B,EAJ9B;EAMA,MAAM8B,SAAS,GAAGzB,sBAAsB,CAACQ,KAAD,CAAxC;EACA,MAAMkB,gBAAgB,GAAG1B,sBAAsB,CAACuB,YAAD,CAA/C;EACA,MAAMI,UAAU,GAAGR,
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","View","Platform","RadioButton","Text","useRadioButtonGroupContext","Direction","GroupDirection","Touchable","extractStyles","getValueForRadioButton","getRadioButtonAlignment","parentDirection","direction","Horizontal","Row","RowReverse","renderLabel","value","labelStyle","textStyle","RadioButtonRow","Icon","label","color","unselectedColor","onPress","labelContainerStyle","radioButtonStyle","selected","disabled","style","rest","contextValue","onValueChange","realValue","realContextValue","isSelected","handlePress","textStyles","viewStyles","styles","mainParent","flexDirection","alignItems","flex","create","justifyContent","paddingStart","minHeight","paddingEnd","display","select","web","cursor","userSelect"],"sources":["RadioButtonRow.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n StyleProp,\n ViewStyle,\n StyleSheet,\n TextStyle,\n View,\n Platform,\n} from \"react-native\";\nimport RadioButton, { RadioButtonProps } from \"./RadioButton\";\nimport Text from \"../Text\";\nimport { useRadioButtonGroupContext } from \"./context\";\nimport type { IconSlot } from \"../../interfaces/Icon\";\nimport { Direction as GroupDirection } from \"./context\";\nimport Touchable from \"../Touchable\";\nimport { extractStyles, getValueForRadioButton } from \"../../utilities\";\n\nexport enum Direction {\n Row = \"row\",\n RowReverse = \"row-reverse\",\n}\n\nexport interface RadioButtonRowProps extends Omit<RadioButtonProps, \"onPress\"> {\n label: string | React.ReactNode;\n value: string | number; // A string (or number that will be parsed String(number)) that this radio button row represents when selected\n color?: string;\n unselectedColor?: string;\n labelContainerStyle: StyleProp<ViewStyle>;\n radioButtonStyle?: StyleProp<ViewStyle>;\n labelStyle?: StyleProp<TextStyle>;\n onPress?: (value: string) => void;\n direction?: Direction;\n}\n\nconst getRadioButtonAlignment = (\n parentDirection: GroupDirection | undefined,\n direction: Direction\n) => {\n if (parentDirection === GroupDirection.Horizontal) {\n return direction === Direction.Row ? \"flex-start\" : \"flex-end\";\n } else if (direction === Direction.RowReverse) {\n return \"flex-start\";\n } else {\n return \"flex-end\";\n }\n};\n\nconst renderLabel = (\n value: string | React.ReactNode,\n labelStyle: StyleProp<TextStyle>,\n textStyle: StyleProp<TextStyle>\n) => {\n if (typeof value === \"string\") {\n return <Text style={[labelStyle, textStyle]}>{value}</Text>;\n } else {\n return <>{value}</>;\n }\n};\n\nconst RadioButtonRow: React.FC<RadioButtonRowProps & IconSlot> = ({\n Icon,\n label,\n value = \"\",\n color,\n unselectedColor,\n onPress,\n labelContainerStyle,\n labelStyle,\n radioButtonStyle,\n direction = Direction.Row,\n selected,\n disabled,\n style,\n ...rest\n}) => {\n const {\n value: contextValue,\n onValueChange,\n direction: parentDirection,\n } = useRadioButtonGroupContext();\n\n const realValue = getValueForRadioButton(value);\n const realContextValue = getValueForRadioButton(contextValue);\n const isSelected = selected ?? realContextValue === realValue;\n\n const handlePress = () => {\n onPress?.(realValue);\n onValueChange?.(realValue);\n };\n\n const { textStyles, viewStyles } = extractStyles(style);\n\n return (\n <Touchable\n onPress={handlePress}\n style={[styles.mainParent, { flexDirection: direction }, viewStyles]}\n disabled={disabled}\n {...rest}\n >\n <View\n style={[\n styles.label,\n {\n alignItems: direction === Direction.Row ? \"flex-start\" : \"flex-end\",\n },\n labelContainerStyle,\n ]}\n >\n {renderLabel(label, labelStyle, textStyles)}\n </View>\n <View\n style={{\n flex: 1,\n alignItems: getRadioButtonAlignment(parentDirection, direction),\n }}\n >\n <RadioButton\n Icon={Icon}\n selected={isSelected}\n value={realValue}\n color={color}\n unselectedColor={unselectedColor}\n style={radioButtonStyle}\n />\n </View>\n </Touchable>\n );\n};\n\nconst styles = StyleSheet.create({\n mainParent: {\n alignItems: \"center\",\n justifyContent: \"space-around\",\n paddingStart: 20,\n minHeight: 50,\n paddingEnd: 20,\n display: \"flex\",\n ...Platform.select({\n web: {\n cursor: \"pointer\",\n userSelect: \"none\",\n },\n }),\n },\n label: {\n flex: 3,\n },\n});\n\nexport default RadioButtonRow;\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
|
|
2
|
-
//# sourceMappingURL=ResizeMode.js.map
|
|
2
|
+
//# sourceMappingURL=ResizeMode.js.mapode.js.map
|
|
@@ -243,7 +243,7 @@ export default class StepIndicator extends Component {
|
|
|
243
243
|
stepStatus: this.getStepStatus(position)
|
|
244
244
|
}) : /*#__PURE__*/React.createElement(Text, {
|
|
245
245
|
style: indicatorLabelStyle
|
|
246
|
-
},
|
|
246
|
+
}, "".concat(position + 1)));
|
|
247
247
|
});
|
|
248
248
|
|
|
249
249
|
_defineProperty(this, "getStepStatus", stepPosition => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"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"],"sources":["StepIndicator.tsx"],"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"],"mappings":"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"}
|
|
1
|
+
{"version":3,"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"],"sources":["StepIndicator.tsx"],"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"],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ const Stepper = _ref => {
|
|
|
21
21
|
},
|
|
22
22
|
Icon
|
|
23
23
|
} = _ref;
|
|
24
|
-
const [value, setValue] = useState(defaultValue
|
|
24
|
+
const [value, setValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : 0);
|
|
25
25
|
|
|
26
26
|
const isValidValue = valueArg => valueArg >= min && valueArg <= max;
|
|
27
27
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useEffect","useState","View","Text","isNumber","withTheme","IconButton","Stepper","min","Infinity","max","value","valueProp","defaultValue","style","typeStyle","iconSize","iconColor","onChange","theme","colors","typography","Icon","setValue","isValidValue","valueArg","handlePlusOrMinus","type","newValue","flexDirection","opacity","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"sources":["Stepper.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from \"react\";\nimport { View, Text, StyleProp, ViewStyle, TextStyle } from \"react-native\";\nimport { isNumber } from \"lodash\";\n\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\nimport IconButton from \"./IconButton\";\n\ntype Props = {\n min: number;\n max: number;\n value?: number;\n defaultValue?: number;\n style?: StyleProp<ViewStyle>;\n typeStyle?: StyleProp<TextStyle>;\n iconSize: number;\n iconColor?: string;\n onChange?: (value: number) => void;\n theme: Theme;\n} & IconSlot;\n\nconst Stepper: FC<Props> = ({\n min = -Infinity,\n max = Infinity,\n value: valueProp,\n defaultValue,\n style,\n typeStyle,\n iconSize = 24,\n iconColor,\n onChange,\n theme: { colors, typography },\n Icon,\n}) => {\n const [value, setValue] = useState(defaultValue ?? 0);\n\n const isValidValue = (valueArg: number) => valueArg >= min && valueArg <= max;\n\n const handlePlusOrMinus = (type: \"plus\" | \"minus\") => {\n const newValue = type === \"plus\" ? value + 1 : value - 1;\n\n if (isValidValue(newValue)) {\n setValue(newValue);\n onChange?.(newValue);\n }\n };\n\n useEffect(() => {\n if (\n valueProp != null &&\n isNumber(valueProp) &&\n valueProp !== value &&\n isValidValue(valueProp)\n ) {\n setValue(valueProp);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [valueProp]);\n\n return (\n <View style={[{ flexDirection: \"row\" }, style]}>\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/remove\"\n onPress={() => handlePlusOrMinus(\"minus\")}\n size={iconSize}\n color={iconColor}\n disabled={value === min}\n style={{ opacity: value === min ? 0.5 : 1 }}\n />\n\n <Text\n style={[\n typography.body1,\n {\n textAlign: \"center\",\n alignSelf: \"center\",\n color: colors.medium,\n marginHorizontal: 8,\n },\n typeStyle,\n ]}\n >\n {value}\n </Text>\n\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/add\"\n onPress={() => handlePlusOrMinus(\"plus\")}\n size={iconSize}\n color={iconColor}\n disabled={value === max}\n style={{ opacity: value === max ? 0.5 : 1 }}\n />\n </View>\n );\n};\n\nexport default withTheme(Stepper);\n"],"mappings":"AAAA,OAAOA,KAAP,IAAoBC,SAApB,EAA+BC,QAA/B,QAA+C,OAA/C;AACA,SAASC,IAAT,EAAeC,IAAf,QAA4D,cAA5D;AACA,SAASC,QAAT,QAAyB,QAAzB;AAEA,SAASC,SAAT,QAA0B,YAA1B;AAGA,OAAOC,UAAP,MAAuB,cAAvB;;AAeA,MAAMC,OAAkB,GAAG,QAYrB;EAAA,IAZsB;IAC1BC,GAAG,GAAG,CAACC,QADmB;IAE1BC,GAAG,GAAGD,QAFoB;IAG1BE,KAAK,EAAEC,SAHmB;IAI1BC,YAJ0B;IAK1BC,KAL0B;IAM1BC,SAN0B;IAO1BC,QAAQ,GAAG,EAPe;IAQ1BC,SAR0B;IAS1BC,QAT0B;IAU1BC,KAAK,EAAE;MAAEC,MAAF;MAAUC;IAAV,CAVmB;IAW1BC;EAX0B,CAYtB;EACJ,MAAM,CAACX,KAAD,EAAQY,QAAR,IAAoBtB,QAAQ,CAACY,
|
|
1
|
+
{"version":3,"names":["React","useEffect","useState","View","Text","isNumber","withTheme","IconButton","Stepper","min","Infinity","max","value","valueProp","defaultValue","style","typeStyle","iconSize","iconColor","onChange","theme","colors","typography","Icon","setValue","isValidValue","valueArg","handlePlusOrMinus","type","newValue","flexDirection","opacity","body1","textAlign","alignSelf","color","medium","marginHorizontal"],"sources":["Stepper.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from \"react\";\nimport { View, Text, StyleProp, ViewStyle, TextStyle } from \"react-native\";\nimport { isNumber } from \"lodash\";\n\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\nimport IconButton from \"./IconButton\";\n\ntype Props = {\n min: number;\n max: number;\n value?: number;\n defaultValue?: number;\n style?: StyleProp<ViewStyle>;\n typeStyle?: StyleProp<TextStyle>;\n iconSize: number;\n iconColor?: string;\n onChange?: (value: number) => void;\n theme: Theme;\n} & IconSlot;\n\nconst Stepper: FC<Props> = ({\n min = -Infinity,\n max = Infinity,\n value: valueProp,\n defaultValue,\n style,\n typeStyle,\n iconSize = 24,\n iconColor,\n onChange,\n theme: { colors, typography },\n Icon,\n}) => {\n const [value, setValue] = useState(defaultValue ?? 0);\n\n const isValidValue = (valueArg: number) => valueArg >= min && valueArg <= max;\n\n const handlePlusOrMinus = (type: \"plus\" | \"minus\") => {\n const newValue = type === \"plus\" ? value + 1 : value - 1;\n\n if (isValidValue(newValue)) {\n setValue(newValue);\n onChange?.(newValue);\n }\n };\n\n useEffect(() => {\n if (\n valueProp != null &&\n isNumber(valueProp) &&\n valueProp !== value &&\n isValidValue(valueProp)\n ) {\n setValue(valueProp);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [valueProp]);\n\n return (\n <View style={[{ flexDirection: \"row\" }, style]}>\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/remove\"\n onPress={() => handlePlusOrMinus(\"minus\")}\n size={iconSize}\n color={iconColor}\n disabled={value === min}\n style={{ opacity: value === min ? 0.5 : 1 }}\n />\n\n <Text\n style={[\n typography.body1,\n {\n textAlign: \"center\",\n alignSelf: \"center\",\n color: colors.medium,\n marginHorizontal: 8,\n },\n typeStyle,\n ]}\n >\n {value}\n </Text>\n\n <IconButton\n Icon={Icon}\n icon=\"MaterialIcons/add\"\n onPress={() => handlePlusOrMinus(\"plus\")}\n size={iconSize}\n color={iconColor}\n disabled={value === max}\n style={{ opacity: value === max ? 0.5 : 1 }}\n />\n </View>\n );\n};\n\nexport default withTheme(Stepper);\n"],"mappings":"AAAA,OAAOA,KAAP,IAAoBC,SAApB,EAA+BC,QAA/B,QAA+C,OAA/C;AACA,SAASC,IAAT,EAAeC,IAAf,QAA4D,cAA5D;AACA,SAASC,QAAT,QAAyB,QAAzB;AAEA,SAASC,SAAT,QAA0B,YAA1B;AAGA,OAAOC,UAAP,MAAuB,cAAvB;;AAeA,MAAMC,OAAkB,GAAG,QAYrB;EAAA,IAZsB;IAC1BC,GAAG,GAAG,CAACC,QADmB;IAE1BC,GAAG,GAAGD,QAFoB;IAG1BE,KAAK,EAAEC,SAHmB;IAI1BC,YAJ0B;IAK1BC,KAL0B;IAM1BC,SAN0B;IAO1BC,QAAQ,GAAG,EAPe;IAQ1BC,SAR0B;IAS1BC,QAT0B;IAU1BC,KAAK,EAAE;MAAEC,MAAF;MAAUC;IAAV,CAVmB;IAW1BC;EAX0B,CAYtB;EACJ,MAAM,CAACX,KAAD,EAAQY,QAAR,IAAoBtB,QAAQ,CAACY,YAAD,aAACA,YAAD,cAACA,YAAD,GAAiB,CAAjB,CAAlC;;EAEA,MAAMW,YAAY,GAAIC,QAAD,IAAsBA,QAAQ,IAAIjB,GAAZ,IAAmBiB,QAAQ,IAAIf,GAA1E;;EAEA,MAAMgB,iBAAiB,GAAIC,IAAD,IAA4B;IACpD,MAAMC,QAAQ,GAAGD,IAAI,KAAK,MAAT,GAAkBhB,KAAK,GAAG,CAA1B,GAA8BA,KAAK,GAAG,CAAvD;;IAEA,IAAIa,YAAY,CAACI,QAAD,CAAhB,EAA4B;MAC1BL,QAAQ,CAACK,QAAD,CAAR;MACAV,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGU,QAAH,CAAR;IACD;EACF,CAPD;;EASA5B,SAAS,CAAC,MAAM;IACd,IACEY,SAAS,IAAI,IAAb,IACAR,QAAQ,CAACQ,SAAD,CADR,IAEAA,SAAS,KAAKD,KAFd,IAGAa,YAAY,CAACZ,SAAD,CAJd,EAKE;MACAW,QAAQ,CAACX,SAAD,CAAR;IACD,CARa,CASd;;EACD,CAVQ,EAUN,CAACA,SAAD,CAVM,CAAT;EAYA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAAC;MAAEiB,aAAa,EAAE;IAAjB,CAAD,EAA2Bf,KAA3B;EAAb,gBACE,oBAAC,UAAD;IACE,IAAI,EAAEQ,IADR;IAEE,IAAI,EAAC,sBAFP;IAGE,OAAO,EAAE,MAAMI,iBAAiB,CAAC,OAAD,CAHlC;IAIE,IAAI,EAAEV,QAJR;IAKE,KAAK,EAAEC,SALT;IAME,QAAQ,EAAEN,KAAK,KAAKH,GANtB;IAOE,KAAK,EAAE;MAAEsB,OAAO,EAAEnB,KAAK,KAAKH,GAAV,GAAgB,GAAhB,GAAsB;IAAjC;EAPT,EADF,eAWE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLa,UAAU,CAACU,KADN,EAEL;MACEC,SAAS,EAAE,QADb;MAEEC,SAAS,EAAE,QAFb;MAGEC,KAAK,EAAEd,MAAM,CAACe,MAHhB;MAIEC,gBAAgB,EAAE;IAJpB,CAFK,EAQLrB,SARK;EADT,GAYGJ,KAZH,CAXF,eA0BE,oBAAC,UAAD;IACE,IAAI,EAAEW,IADR;IAEE,IAAI,EAAC,mBAFP;IAGE,OAAO,EAAE,MAAMI,iBAAiB,CAAC,MAAD,CAHlC;IAIE,IAAI,EAAEV,QAJR;IAKE,KAAK,EAAEC,SALT;IAME,QAAQ,EAAEN,KAAK,KAAKD,GANtB;IAOE,KAAK,EAAE;MAAEoB,OAAO,EAAEnB,KAAK,KAAKD,GAAV,GAAgB,GAAhB,GAAsB;IAAjC;EAPT,EA1BF,CADF;AAsCD,CA5ED;;AA8EA,eAAeL,SAAS,CAACE,OAAD,CAAxB"}
|
package/lib/module/utilities.js
CHANGED
|
@@ -78,7 +78,7 @@ export function getValueForRadioButton(value) {
|
|
|
78
78
|
} else if (isNumber(value)) {
|
|
79
79
|
return String(value);
|
|
80
80
|
} else {
|
|
81
|
-
throw new Error(
|
|
81
|
+
throw new Error("Invalid value: ".concat(value));
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
84
|
//# sourceMappingURL=utilities.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","isString","isNumber","pick","pickBy","identity","extractStyles","style","color","fontFamily","fontWeight","fontSize","lineHeight","letterSpacing","textTransform","textAlign","textDecorationLine","textDecorationColor","textDecorationStyle","viewStyles","flatten","textStyles","borderStyleNames","marginStyleNames","extractBorderAndMarginStyles","additionalBorderStyles","additionalMarginStyles","flatStyle","borderStyles","marginStyles","applyStyles","baseStyles","stylesToApply","flattenedStyles","key","value","Object","entries","getValueForRadioButton","String","Error"],"sources":["utilities.ts"],"sourcesContent":["import { StyleSheet, StyleProp, TextStyle } from \"react-native\";\nimport { isString, isNumber, pick, pickBy, identity } from \"lodash\";\n\nexport function extractStyles(style: StyleProp<any>) {\n const {\n color,\n fontFamily,\n fontWeight,\n fontSize,\n lineHeight,\n letterSpacing,\n textTransform,\n textAlign,\n textDecorationLine,\n textDecorationColor,\n textDecorationStyle,\n ...viewStyles\n } = StyleSheet.flatten(style || {});\n\n const textStyles: TextStyle = {\n color,\n fontFamily,\n fontWeight,\n fontSize,\n lineHeight,\n letterSpacing,\n textTransform,\n textAlign,\n textDecorationLine,\n textDecorationColor,\n textDecorationStyle,\n };\n\n return { viewStyles, textStyles };\n}\n\nexport const borderStyleNames = [\n \"borderRadius\",\n \"borderBottomColor\",\n \"borderBottomEndRadius\",\n \"borderBottomLeftRadius\",\n \"borderBottomRightRadius\",\n \"borderBottomStartRadius\",\n \"borderBottomWidth\",\n \"borderColor\",\n \"borderEndColor\",\n \"borderLeftColor\",\n \"borderLeftWidth\",\n \"borderRadius\",\n \"borderRightColor\",\n \"borderRightWidth\",\n \"borderStartColor\",\n \"borderStyle\",\n \"borderTopColor\",\n \"borderTopEndRadius\",\n \"borderTopLeftRadius\",\n \"borderTopRightRadius\",\n \"borderTopStartRadius\",\n \"borderTopWidth\",\n \"borderWidth\",\n];\n\nexport const marginStyleNames = [\n \"margin\",\n \"marginBottom\",\n \"marginEnd\",\n \"marginHorizontal\",\n \"marginLeft\",\n \"marginRight\",\n \"marginStart\",\n \"marginTop\",\n \"marginVertical\",\n];\n\nexport function extractBorderAndMarginStyles(\n style: StyleProp<any>,\n additionalBorderStyles?: string[],\n additionalMarginStyles?: string[]\n) {\n const flatStyle = StyleSheet.flatten(style || {});\n\n const borderStyles = pickBy(\n pick(flatStyle, [\n ...borderStyleNames,\n ...(additionalBorderStyles ? additionalBorderStyles : []),\n ]),\n identity\n );\n\n const marginStyles = pickBy(\n pick(flatStyle, [\n ...marginStyleNames,\n ...(additionalMarginStyles ? additionalMarginStyles : []),\n ]),\n identity\n );\n\n return { borderStyles, marginStyles };\n}\n\n/**\n * Merges a style object on top of another style object. In React Native,\n * keys with undefined values in a style object will still override styles\n * that appear earlier in a sequence. This avoids that problem.\n *\n * This lets us avoid the `...(something ? { something } : {})` pattern.\n * There doesn't seem to be a better way to do this. These all seem to not\n * work (i.e. they all result in `{ color: undefined }`:\n * `const mergedStyles = [{ color: \"red\" }, { color: undefined }]`\n * `const mergedStyles = StyleSheet.compose({ color: \"red\" }, { color: undefined })`\n * `const mergedStyles = StyleSheet.flatten([{ color: \"red\" }, { color: undefined }])`\n */\nexport function applyStyles(\n baseStyles: Array<StyleProp<any>>,\n stylesToApply: StyleProp<any> | undefined\n) {\n if (!stylesToApply) {\n return;\n }\n\n const flattenedStyles = StyleSheet.flatten(baseStyles);\n\n for (const [key, value] of Object.entries(stylesToApply)) {\n if (value != null) {\n flattenedStyles[key] = value;\n }\n }\n\n return flattenedStyles;\n}\n\nexport function getValueForRadioButton(value: string | number) {\n if (isString(value)) {\n return value;\n } else if (isNumber(value)) {\n return String(value);\n } else {\n throw new Error(`Invalid value: ${value}`);\n }\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"names":["StyleSheet","isString","isNumber","pick","pickBy","identity","extractStyles","style","color","fontFamily","fontWeight","fontSize","lineHeight","letterSpacing","textTransform","textAlign","textDecorationLine","textDecorationColor","textDecorationStyle","viewStyles","flatten","textStyles","borderStyleNames","marginStyleNames","extractBorderAndMarginStyles","additionalBorderStyles","additionalMarginStyles","flatStyle","borderStyles","marginStyles","applyStyles","baseStyles","stylesToApply","flattenedStyles","key","value","Object","entries","getValueForRadioButton","String","Error"],"sources":["utilities.ts"],"sourcesContent":["import { StyleSheet, StyleProp, TextStyle } from \"react-native\";\nimport { isString, isNumber, pick, pickBy, identity } from \"lodash\";\n\nexport function extractStyles(style: StyleProp<any>) {\n const {\n color,\n fontFamily,\n fontWeight,\n fontSize,\n lineHeight,\n letterSpacing,\n textTransform,\n textAlign,\n textDecorationLine,\n textDecorationColor,\n textDecorationStyle,\n ...viewStyles\n } = StyleSheet.flatten(style || {});\n\n const textStyles: TextStyle = {\n color,\n fontFamily,\n fontWeight,\n fontSize,\n lineHeight,\n letterSpacing,\n textTransform,\n textAlign,\n textDecorationLine,\n textDecorationColor,\n textDecorationStyle,\n };\n\n return { viewStyles, textStyles };\n}\n\nexport const borderStyleNames = [\n \"borderRadius\",\n \"borderBottomColor\",\n \"borderBottomEndRadius\",\n \"borderBottomLeftRadius\",\n \"borderBottomRightRadius\",\n \"borderBottomStartRadius\",\n \"borderBottomWidth\",\n \"borderColor\",\n \"borderEndColor\",\n \"borderLeftColor\",\n \"borderLeftWidth\",\n \"borderRadius\",\n \"borderRightColor\",\n \"borderRightWidth\",\n \"borderStartColor\",\n \"borderStyle\",\n \"borderTopColor\",\n \"borderTopEndRadius\",\n \"borderTopLeftRadius\",\n \"borderTopRightRadius\",\n \"borderTopStartRadius\",\n \"borderTopWidth\",\n \"borderWidth\",\n];\n\nexport const marginStyleNames = [\n \"margin\",\n \"marginBottom\",\n \"marginEnd\",\n \"marginHorizontal\",\n \"marginLeft\",\n \"marginRight\",\n \"marginStart\",\n \"marginTop\",\n \"marginVertical\",\n];\n\nexport function extractBorderAndMarginStyles(\n style: StyleProp<any>,\n additionalBorderStyles?: string[],\n additionalMarginStyles?: string[]\n) {\n const flatStyle = StyleSheet.flatten(style || {});\n\n const borderStyles = pickBy(\n pick(flatStyle, [\n ...borderStyleNames,\n ...(additionalBorderStyles ? additionalBorderStyles : []),\n ]),\n identity\n );\n\n const marginStyles = pickBy(\n pick(flatStyle, [\n ...marginStyleNames,\n ...(additionalMarginStyles ? additionalMarginStyles : []),\n ]),\n identity\n );\n\n return { borderStyles, marginStyles };\n}\n\n/**\n * Merges a style object on top of another style object. In React Native,\n * keys with undefined values in a style object will still override styles\n * that appear earlier in a sequence. This avoids that problem.\n *\n * This lets us avoid the `...(something ? { something } : {})` pattern.\n * There doesn't seem to be a better way to do this. These all seem to not\n * work (i.e. they all result in `{ color: undefined }`:\n * `const mergedStyles = [{ color: \"red\" }, { color: undefined }]`\n * `const mergedStyles = StyleSheet.compose({ color: \"red\" }, { color: undefined })`\n * `const mergedStyles = StyleSheet.flatten([{ color: \"red\" }, { color: undefined }])`\n */\nexport function applyStyles(\n baseStyles: Array<StyleProp<any>>,\n stylesToApply: StyleProp<any> | undefined\n) {\n if (!stylesToApply) {\n return;\n }\n\n const flattenedStyles = StyleSheet.flatten(baseStyles);\n\n for (const [key, value] of Object.entries(stylesToApply)) {\n if (value != null) {\n flattenedStyles[key] = value;\n }\n }\n\n return flattenedStyles;\n}\n\nexport function getValueForRadioButton(value: string | number) {\n if (isString(value)) {\n return value;\n } else if (isNumber(value)) {\n return String(value);\n } else {\n throw new Error(`Invalid value: ${value}`);\n }\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "46.
|
|
3
|
+
"version": "46.2.0",
|
|
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": "6928bf4d50679f6627255134daab0fb074881036"
|
|
83
83
|
}
|
package/src/Provider.js
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { ThemeProvider } from "./theming";
|
|
3
|
+
import PortalHost from "./components/Portal/PortalHost";
|
|
4
|
+
export default class Provider extends React.Component {
|
|
5
|
+
render() {
|
|
6
|
+
return (React.createElement(PortalHost, null,
|
|
7
|
+
React.createElement(ThemeProvider, { theme: this.props.theme }, this.props.children)));
|
|
8
|
+
}
|
|
9
|
+
}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { View, StyleSheet, Pressable, } from "react-native";
|
|
3
|
+
import Text from "../Text";
|
|
4
|
+
import { withTheme } from "../../theming";
|
|
5
|
+
import { extractStyles } from "../../utilities";
|
|
6
|
+
const AccordionGroup = ({ label, expanded: expandedProp = false, openColor, closedColor, caretColor: caretColorProp, caretSize = 24, icon, iconSize = 24, style, children, theme, Icon, }) => {
|
|
7
|
+
const [expanded, setExpanded] = React.useState(expandedProp);
|
|
8
|
+
const { textStyles, viewStyles } = extractStyles(style);
|
|
9
|
+
const expandedColor = openColor || theme.colors.primary;
|
|
10
|
+
const collapsedColor = closedColor || theme.colors.primary;
|
|
11
|
+
const labelColor = expanded ? expandedColor : collapsedColor;
|
|
12
|
+
const caretColor = caretColorProp || labelColor;
|
|
13
|
+
const handlePressAction = () => {
|
|
14
|
+
setExpanded(!expanded);
|
|
15
|
+
};
|
|
16
|
+
return (React.createElement(React.Fragment, null,
|
|
17
|
+
React.createElement(Pressable, { style: [styles.row, viewStyles], onPress: handlePressAction, accessibilityRole: "button" },
|
|
18
|
+
icon ? (React.createElement(Icon, { name: icon, size: iconSize, color: labelColor, style: styles.icon })) : null,
|
|
19
|
+
React.createElement(View, { style: styles.content },
|
|
20
|
+
React.createElement(Text, { selectable: false, style: [
|
|
21
|
+
textStyles,
|
|
22
|
+
{
|
|
23
|
+
color: labelColor,
|
|
24
|
+
},
|
|
25
|
+
] }, label)),
|
|
26
|
+
React.createElement(Icon, { name: expanded
|
|
27
|
+
? "MaterialIcons/keyboard-arrow-up"
|
|
28
|
+
: "MaterialIcons/keyboard-arrow-down", color: caretColor, size: caretSize })),
|
|
29
|
+
expanded ? children : null));
|
|
30
|
+
};
|
|
31
|
+
const styles = StyleSheet.create({
|
|
32
|
+
row: {
|
|
33
|
+
flexDirection: "row",
|
|
34
|
+
alignItems: "center",
|
|
35
|
+
},
|
|
36
|
+
content: {
|
|
37
|
+
flex: 1,
|
|
38
|
+
justifyContent: "center",
|
|
39
|
+
},
|
|
40
|
+
icon: {
|
|
41
|
+
marginRight: 8,
|
|
42
|
+
},
|
|
43
|
+
});
|
|
44
|
+
export default withTheme(AccordionGroup);
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Pressable, StyleSheet, View, } from "react-native";
|
|
3
|
+
import Text from "../Text";
|
|
4
|
+
import { extractStyles } from "../../utilities";
|
|
5
|
+
import { withTheme } from "../../theming";
|
|
6
|
+
const AccordionItem = ({ Icon, icon, label, style, iconColor, theme, ...rest }) => {
|
|
7
|
+
const { textStyles, viewStyles } = extractStyles(style);
|
|
8
|
+
return (React.createElement(Pressable, { style: [styles.container, viewStyles], ...rest },
|
|
9
|
+
React.createElement(View, { style: styles.row },
|
|
10
|
+
icon ? (React.createElement(Icon, { name: icon, size: 24, color: iconColor || theme.colors.primary })) : null,
|
|
11
|
+
React.createElement(View, { style: [styles.item, styles.content] },
|
|
12
|
+
React.createElement(Text, { selectable: false, style: textStyles }, label)))));
|
|
13
|
+
};
|
|
14
|
+
const styles = StyleSheet.create({
|
|
15
|
+
container: {
|
|
16
|
+
padding: 8,
|
|
17
|
+
},
|
|
18
|
+
row: {
|
|
19
|
+
flexDirection: "row",
|
|
20
|
+
alignItems: "center",
|
|
21
|
+
paddingLeft: 8,
|
|
22
|
+
},
|
|
23
|
+
item: {
|
|
24
|
+
marginVertical: 6,
|
|
25
|
+
paddingLeft: 8,
|
|
26
|
+
},
|
|
27
|
+
content: {
|
|
28
|
+
flex: 1,
|
|
29
|
+
justifyContent: "center",
|
|
30
|
+
},
|
|
31
|
+
});
|
|
32
|
+
export default withTheme(AccordionItem);
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { View, StyleSheet } from "react-native";
|
|
3
|
+
import Portal from "../Portal/Portal";
|
|
4
|
+
import Touchable from "../Touchable";
|
|
5
|
+
import ActionSheetCancel from "./ActionSheetCancel";
|
|
6
|
+
const ActionSheet = ({ visible = false, onClose, children }) => {
|
|
7
|
+
return visible ? (React.createElement(Portal, null,
|
|
8
|
+
React.createElement(Touchable, { style: styles.wrapper, onPress: onClose },
|
|
9
|
+
React.createElement(View, { style: styles.overlay }),
|
|
10
|
+
React.createElement(View, { style: styles.groupWrapper },
|
|
11
|
+
React.createElement(View, { style: styles.group }, React.Children.toArray(children).filter((child) => (child === null || child === void 0 ? void 0 : child.type) !== ActionSheetCancel)),
|
|
12
|
+
React.createElement(View, { style: styles.group }, React.Children.toArray(children).filter((child) => child.type === ActionSheetCancel)))))) : (React.createElement(React.Fragment, null));
|
|
13
|
+
};
|
|
14
|
+
const styles = StyleSheet.create({
|
|
15
|
+
wrapper: {
|
|
16
|
+
flex: 1,
|
|
17
|
+
display: "flex",
|
|
18
|
+
flexDirection: "column",
|
|
19
|
+
},
|
|
20
|
+
overlay: {
|
|
21
|
+
position: "absolute",
|
|
22
|
+
top: 0,
|
|
23
|
+
left: 0,
|
|
24
|
+
right: 0,
|
|
25
|
+
bottom: 0,
|
|
26
|
+
backgroundColor: "#000000",
|
|
27
|
+
opacity: 0.3,
|
|
28
|
+
},
|
|
29
|
+
groupWrapper: {
|
|
30
|
+
flex: 1,
|
|
31
|
+
flexDirection: "column",
|
|
32
|
+
justifyContent: "flex-end",
|
|
33
|
+
display: "flex",
|
|
34
|
+
marginBottom: 25,
|
|
35
|
+
},
|
|
36
|
+
group: {
|
|
37
|
+
display: "flex",
|
|
38
|
+
flexDirection: "column",
|
|
39
|
+
borderRadius: 10,
|
|
40
|
+
marginHorizontal: 7,
|
|
41
|
+
marginVertical: 2.5,
|
|
42
|
+
overflow: "hidden",
|
|
43
|
+
},
|
|
44
|
+
});
|
|
45
|
+
export default ActionSheet;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import ActionSheetItem from "./ActionSheetItem";
|
|
3
|
+
const ActionSheetCancel = ({ label = "Cancel", color, style, onPress, }) => {
|
|
4
|
+
return (React.createElement(ActionSheetItem, { label: label, color: color || "#FF453A", style: [style], onPress: onPress }));
|
|
5
|
+
};
|
|
6
|
+
export default ActionSheetCancel;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Text, StyleSheet, TouchableOpacity, } from "react-native";
|
|
3
|
+
import { extractStyles } from "../../utilities";
|
|
4
|
+
const ActionSheetItem = ({ label, style, color, onPress, }) => {
|
|
5
|
+
const { textStyles, viewStyles } = extractStyles(style);
|
|
6
|
+
return (React.createElement(TouchableOpacity, { activeOpacity: 0.7, style: [styles.wrapper, viewStyles], onPress: onPress },
|
|
7
|
+
React.createElement(Text, { style: [styles.label, textStyles, { color }] }, label)));
|
|
8
|
+
};
|
|
9
|
+
const styles = StyleSheet.create({
|
|
10
|
+
wrapper: {
|
|
11
|
+
borderBottomWidth: StyleSheet.hairlineWidth,
|
|
12
|
+
borderBottomColor: "#CCCCCC",
|
|
13
|
+
backgroundColor: "#F1F1F1",
|
|
14
|
+
minHeight: 50,
|
|
15
|
+
overflow: "hidden",
|
|
16
|
+
display: "flex",
|
|
17
|
+
justifyContent: "center",
|
|
18
|
+
},
|
|
19
|
+
label: {
|
|
20
|
+
fontSize: 16,
|
|
21
|
+
textAlign: "center",
|
|
22
|
+
color: "#0A84FF",
|
|
23
|
+
fontWeight: "500",
|
|
24
|
+
overflow: "hidden",
|
|
25
|
+
paddingHorizontal: 20,
|
|
26
|
+
paddingVertical: 10,
|
|
27
|
+
alignSelf: "center",
|
|
28
|
+
},
|
|
29
|
+
});
|
|
30
|
+
export default ActionSheetItem;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Animated, Easing, } from "react-native";
|
|
3
|
+
import CircularProgress from "./CircularProgress";
|
|
4
|
+
const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
|
|
5
|
+
const AnimatedCircularProgress = ({ duration = 500, easing = Easing.out(Easing.ease), fill, prefill = 0, useNativeDriver = false, tintColorSecondary, onAnimationComplete, tintColor = "black", ...other }) => {
|
|
6
|
+
const [fillAnimation] = React.useState(new Animated.Value(prefill));
|
|
7
|
+
const animate = React.useCallback((toVal = -1, dur, ease) => {
|
|
8
|
+
const toValue = toVal >= 0 ? toVal : fill;
|
|
9
|
+
const dura = dur || duration;
|
|
10
|
+
const eas = ease || easing;
|
|
11
|
+
const useNative = useNativeDriver;
|
|
12
|
+
const anim = Animated.timing(fillAnimation, {
|
|
13
|
+
useNativeDriver: useNative,
|
|
14
|
+
toValue,
|
|
15
|
+
easing: eas,
|
|
16
|
+
duration: dura,
|
|
17
|
+
});
|
|
18
|
+
anim.start(onAnimationComplete);
|
|
19
|
+
return anim;
|
|
20
|
+
}, [
|
|
21
|
+
duration,
|
|
22
|
+
easing,
|
|
23
|
+
fill,
|
|
24
|
+
useNativeDriver,
|
|
25
|
+
fillAnimation,
|
|
26
|
+
onAnimationComplete,
|
|
27
|
+
]);
|
|
28
|
+
const animateColor = () => {
|
|
29
|
+
if (!tintColorSecondary) {
|
|
30
|
+
return tintColor;
|
|
31
|
+
}
|
|
32
|
+
const tintAnimation = fillAnimation.interpolate({
|
|
33
|
+
inputRange: [0, 100],
|
|
34
|
+
outputRange: [tintColor, tintColorSecondary],
|
|
35
|
+
});
|
|
36
|
+
return tintAnimation;
|
|
37
|
+
};
|
|
38
|
+
React.useEffect(() => {
|
|
39
|
+
animate();
|
|
40
|
+
}, [fill, animate]);
|
|
41
|
+
return (React.createElement(AnimatedProgress, { ...other, style: other.style, childrenContainerStyle: other.childrenContainerStyle, fill: fillAnimation, tintColor: animateColor() }));
|
|
42
|
+
};
|
|
43
|
+
export default AnimatedCircularProgress;
|