@draftbit/core 46.0.1-696ea7.1 → 46.0.1-e1d164.1

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.
Files changed (44) hide show
  1. package/lib/commonjs/components/Carousel.js +1 -3
  2. package/lib/commonjs/components/Carousel.js.map +1 -1
  3. package/lib/commonjs/components/Checkbox/Checkbox.js.map +1 -1
  4. package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +23 -6
  5. package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js.map +1 -1
  6. package/lib/commonjs/components/CircleImage.js +17 -3
  7. package/lib/commonjs/components/CircleImage.js.map +1 -1
  8. package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js +3 -3
  9. package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js.map +1 -1
  10. package/lib/commonjs/components/Picker/Picker.js +6 -3
  11. package/lib/commonjs/components/Picker/Picker.js.map +1 -1
  12. package/lib/commonjs/components/Picker/PickerComponent.android.js +2 -2
  13. package/lib/commonjs/components/Picker/PickerComponent.android.js.map +1 -1
  14. package/lib/commonjs/components/Picker/PickerComponent.ios.js +2 -2
  15. package/lib/commonjs/components/Picker/PickerComponent.ios.js.map +1 -1
  16. package/lib/commonjs/components/Picker/PickerComponent.web.js +2 -2
  17. package/lib/commonjs/components/Picker/PickerComponent.web.js.map +1 -1
  18. package/lib/commonjs/components/RadioButton/RadioButton.js +1 -1
  19. package/lib/commonjs/components/RadioButton/RadioButton.js.map +1 -1
  20. package/lib/commonjs/components/RadioButton/RadioButtonRow.js +1 -1
  21. package/lib/commonjs/components/RadioButton/RadioButtonRow.js.map +1 -1
  22. package/lib/commonjs/components/Stepper.js +1 -1
  23. package/lib/commonjs/components/Stepper.js.map +1 -1
  24. package/lib/module/components/Carousel.js +1 -3
  25. package/lib/module/components/Carousel.js.map +1 -1
  26. package/lib/module/components/Checkbox/Checkbox.js.map +1 -1
  27. package/lib/module/components/DatePicker/DatePickerComponent.web.js +3 -3
  28. package/lib/module/components/DatePicker/DatePickerComponent.web.js.map +1 -1
  29. package/lib/module/components/Picker/Picker.js +3 -3
  30. package/lib/module/components/Picker/Picker.js.map +1 -1
  31. package/lib/module/components/Picker/PickerComponent.android.js +2 -2
  32. package/lib/module/components/Picker/PickerComponent.android.js.map +1 -1
  33. package/lib/module/components/Picker/PickerComponent.ios.js +2 -2
  34. package/lib/module/components/Picker/PickerComponent.ios.js.map +1 -1
  35. package/lib/module/components/Picker/PickerComponent.web.js +2 -2
  36. package/lib/module/components/Picker/PickerComponent.web.js.map +1 -1
  37. package/lib/module/components/RadioButton/RadioButton.js +1 -1
  38. package/lib/module/components/RadioButton/RadioButton.js.map +1 -1
  39. package/lib/module/components/RadioButton/RadioButtonRow.js +1 -1
  40. package/lib/module/components/RadioButton/RadioButtonRow.js.map +1 -1
  41. package/lib/module/components/Stepper.js +1 -1
  42. package/lib/module/components/Stepper.js.map +1 -1
  43. package/package.json +2 -2
  44. package/src/components/Checkbox/Checkbox.tsx +76 -77
@@ -10,7 +10,7 @@ import TextField from "../TextField";
10
10
  import Touchable from "../Touchable";
11
11
 
12
12
  const Picker = _ref => {
13
- var _options$find$label, _options$find;
13
+ var _options$find;
14
14
 
15
15
  let {
16
16
  style,
@@ -67,7 +67,7 @@ const Picker = _ref => {
67
67
  };
68
68
 
69
69
  const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
70
- const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
70
+ const selectedLabel = selectedValue && (((_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) ?? selectedValue);
71
71
  return /*#__PURE__*/React.createElement(Touchable, {
72
72
  disabled: disabled,
73
73
  onPress: toggleFocus,
@@ -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":"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"}
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 !== null && selected !== void 0 ? selected : realContextValue === realValue;
30
+ const isSelected = 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,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"}
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,QAAQ,IAAIY,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 !== null && selected !== void 0 ? selected : realContextValue === realValue;
62
+ const isSelected = 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":"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"}
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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"}
@@ -21,7 +21,7 @@ const Stepper = _ref => {
21
21
  },
22
22
  Icon
23
23
  } = _ref;
24
- const [value, setValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : 0);
24
+ const [value, setValue] = useState(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,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"}
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,YAAY,IAAI,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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "46.0.1-696ea7.1+696ea7b4",
3
+ "version": "46.0.1-e1d164.1+e1d164c2",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -78,5 +78,5 @@
78
78
  ]
79
79
  ]
80
80
  },
81
- "gitHead": "696ea7b40bc30c3682e534d91dbdd5808dae00eb"
81
+ "gitHead": "e1d164c2061a5353d1d3057f9cc4b6660481c016"
82
82
  }
@@ -27,94 +27,93 @@ export interface CheckboxProps {
27
27
  style?: StyleProp<ViewStyle>;
28
28
  }
29
29
 
30
- const Checkbox: React.FC<CheckboxProps & TouchableHighlightProps & IconSlot> =
31
- ({
32
- Icon,
33
- status,
34
- disabled = false,
35
- onPress,
36
- onCheck,
37
- onUncheck,
38
- color,
39
- uncheckedColor,
40
- defaultValue,
41
- checkedIcon = "MaterialCommunityIcons/checkbox-marked",
42
- uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline",
43
- size = 24,
44
- style,
45
- ...rest
46
- }) => {
47
- const [internalValue, setInternalValue] = React.useState<boolean>(
48
- status || defaultValue || false
49
- );
30
+ const Checkbox: React.FC<
31
+ CheckboxProps & TouchableHighlightProps & IconSlot
32
+ > = ({
33
+ Icon,
34
+ status,
35
+ disabled = false,
36
+ onPress,
37
+ onCheck,
38
+ onUncheck,
39
+ color,
40
+ uncheckedColor,
41
+ defaultValue,
42
+ checkedIcon = "MaterialCommunityIcons/checkbox-marked",
43
+ uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline",
44
+ size = 24,
45
+ style,
46
+ ...rest
47
+ }) => {
48
+ const [internalValue, setInternalValue] = React.useState<boolean>(
49
+ status || defaultValue || false
50
+ );
50
51
 
51
- React.useEffect(() => {
52
- if (status != null) {
53
- setInternalValue(status);
54
- }
55
- }, [status]);
52
+ React.useEffect(() => {
53
+ if (status != null) {
54
+ setInternalValue(status);
55
+ }
56
+ }, [status]);
56
57
 
57
- // This special logic is to handle weird APIs like Airtable that return
58
- // true or undefined for a boolean
59
- const previousDefaultValue = usePrevious(defaultValue) as
60
- | boolean
61
- | undefined;
58
+ // This special logic is to handle weird APIs like Airtable that return
59
+ // true or undefined for a boolean
60
+ const previousDefaultValue = usePrevious(defaultValue) as boolean | undefined;
62
61
 
63
- React.useEffect(() => {
64
- if (defaultValue !== previousDefaultValue) {
65
- setInternalValue(Boolean(defaultValue));
66
- }
67
- }, [defaultValue, previousDefaultValue]);
62
+ React.useEffect(() => {
63
+ if (defaultValue !== previousDefaultValue) {
64
+ setInternalValue(Boolean(defaultValue));
65
+ }
66
+ }, [defaultValue, previousDefaultValue]);
68
67
 
69
- const { colors } = useTheme();
68
+ const { colors } = useTheme();
70
69
 
71
- const checkboxColor = internalValue
72
- ? color || colors.primary
73
- : uncheckedColor || colors.primary;
70
+ const checkboxColor = internalValue
71
+ ? color || colors.primary
72
+ : uncheckedColor || colors.primary;
74
73
 
75
- const handlePress = () => {
76
- const newValue = !internalValue;
74
+ const handlePress = () => {
75
+ const newValue = !internalValue;
77
76
 
78
- setInternalValue(newValue);
79
- onPress?.(newValue);
77
+ setInternalValue(newValue);
78
+ onPress?.(newValue);
80
79
 
81
- if (newValue) {
82
- onCheck?.();
83
- }
80
+ if (newValue) {
81
+ onCheck?.();
82
+ }
84
83
 
85
- if (!newValue) {
86
- onUncheck?.();
87
- }
88
- };
84
+ if (!newValue) {
85
+ onUncheck?.();
86
+ }
87
+ };
89
88
 
90
- return (
91
- <Touchable
92
- {...rest}
93
- onPress={handlePress}
94
- disabled={disabled}
95
- accessibilityState={{ disabled }}
96
- accessibilityRole="button"
97
- accessibilityLiveRegion="polite"
98
- style={[styles.container, style, { width: size, height: size }]}
99
- >
100
- <Icon
101
- style={styles.icon}
102
- name={internalValue ? checkedIcon : uncheckedIcon}
103
- size={size}
104
- color={checkboxColor}
89
+ return (
90
+ <Touchable
91
+ {...rest}
92
+ onPress={handlePress}
93
+ disabled={disabled}
94
+ accessibilityState={{ disabled }}
95
+ accessibilityRole="button"
96
+ accessibilityLiveRegion="polite"
97
+ style={[styles.container, style, { width: size, height: size }]}
98
+ >
99
+ <Icon
100
+ style={styles.icon}
101
+ name={internalValue ? checkedIcon : uncheckedIcon}
102
+ size={size}
103
+ color={checkboxColor}
104
+ />
105
+ <View style={[StyleSheet.absoluteFill, styles.fillContainer]}>
106
+ <View
107
+ style={[
108
+ styles.fill,
109
+ { opacity: disabled ? 0.5 : 1 },
110
+ { borderColor: checkboxColor },
111
+ ]}
105
112
  />
106
- <View style={[StyleSheet.absoluteFill, styles.fillContainer]}>
107
- <View
108
- style={[
109
- styles.fill,
110
- { opacity: disabled ? 0.5 : 1 },
111
- { borderColor: checkboxColor },
112
- ]}
113
- />
114
- </View>
115
- </Touchable>
116
- );
117
- };
113
+ </View>
114
+ </Touchable>
115
+ );
116
+ };
118
117
 
119
118
  const styles = StyleSheet.create({
120
119
  container: {