@draftbit/core 43.4.5-d442fc.1 → 43.4.6-5320f5.0

package/lib/module/mappings/CheckboxRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CheckboxRow.ts"],"names":["createTextProp","createTextStyle","createRowDirectionProp","createFieldNameProp","COMPONENT_TYPES","Triggers","createColorProp","SEED_DATA","name","tag","category","input","layout","minHeight","triggers","OnPress","props","label","description","required","defaultValue","labelStyle","editable","direction","fieldName","valuePropName","handlerPropName","color","uncheckedColor"],"mappings":"AAAA,SACEA,cADF,EAEEC,eAFF,EAGEC,sBAHF,EAIEC,mBAJF,EAKEC,eALF,EAMEC,QANF,EAOEC,eAPF,QAQO,iBARP;AAUA,OAAO,MAAMC,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,cADiB;AAEvBC,EAAAA,GAAG,EAAE,aAFkB;AAGvBC,EAAAA,QAAQ,EAAEN,eAAe,CAACO,KAHH;AAIvBC,EAAAA,MAAM,EAAE;AACNC,IAAAA,SAAS,EAAE;AADL,GAJe;AAOvBC,EAAAA,QAAQ,EAAE,CAACT,QAAQ,CAACU,OAAV,CAPa;AAQvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAEjB,cAAc,CAAC;AACpBiB,MAAAA,KAAK,EAAE,OADa;AAEpBC,MAAAA,WAAW,EAAE,iCAFO;AAGpBC,MAAAA,QAAQ,EAAE,IAHU;AAIpBC,MAAAA,YAAY,EAAE;AAJM,KAAD,CADhB;AAOLC,IAAAA,UAAU,EAAEpB,eAAe,CAAC;AAC1BgB,MAAAA,KAAK,EAAE,aADmB;AAE1BC,MAAAA,WAAW,EAAE,gCAFa;AAG1BC,MAAAA,QAAQ,EAAE,KAHgB;AAI1BG,MAAAA,QAAQ,EAAE;AAJgB,KAAD,CAPtB;AAaLC,IAAAA,SAAS,EAAErB,sBAAsB,EAb5B;AAcLsB,IAAAA,SAAS,EAAErB,mBAAmB,CAAC;AAC7BiB,MAAAA,YAAY,EAAE,eADe;AAE7BK,MAAAA,aAAa,EAAE,OAFc;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAAD,CAdzB;AAmBLC,IAAAA,KAAK,EAAErB,eAAe,CAAC;AACrBY,MAAAA,WAAW,EAAE;AADQ,KAAD,CAnBjB;AAsBLU,IAAAA,cAAc,EAAEtB,eAAe,CAAC;AAC9BW,MAAAA,KAAK,EAAE,kBADuB;AAE9BC,MAAAA,WAAW,EAAE;AAFiB,KAAD;AAtB1B;AARgB,CAAlB","sourcesContent":["import {\n  createTextProp,\n  createTextStyle,\n  createRowDirectionProp,\n  createFieldNameProp,\n  COMPONENT_TYPES,\n  Triggers,\n  createColorProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Checkbox Row\",\n  tag: \"CheckboxRow\",\n  category: COMPONENT_TYPES.input,\n  layout: {\n    minHeight: 50,\n  },\n  triggers: [Triggers.OnPress],\n  props: {\n    label: createTextProp({\n      label: \"Label\",\n      description: \"Label to show with the checkbox\",\n      required: true,\n      defaultValue: \"First Option\",\n    }),\n    labelStyle: createTextStyle({\n      label: \"Label Style\",\n      description: \"Change the styles of the label\",\n      required: false,\n      editable: false,\n    }),\n    direction: createRowDirectionProp(),\n    fieldName: createFieldNameProp({\n      defaultValue: \"checkboxValue\",\n      valuePropName: \"value\",\n      handlerPropName: \"onPress\",\n    }),\n    color: createColorProp({\n      description: \"Color for the button (used when the checkbox is checked)\",\n    }),\n    uncheckedColor: createColorProp({\n      label: \"Unselected Color\",\n      description: \"Color for the button when the checkbox is unchecked\",\n    }),\n  },\n};\n"]}
+{"version":3,"sources":["CheckboxRow.ts"],"names":["createTextProp","createTextStyle","createRowDirectionProp","createFieldNameProp","COMPONENT_TYPES","Triggers","createColorProp","SEED_DATA","name","tag","category","input","layout","minHeight","triggers","OnPress","props","label","description","required","defaultValue","labelStyle","editable","direction","fieldName","valuePropName","handlerPropName","color","uncheckedColor"],"mappings":"AAAA,SACEA,cADF,EAEEC,eAFF,EAGEC,sBAHF,EAIEC,mBAJF,EAKEC,eALF,EAMEC,QANF,EAOEC,eAPF,QAQO,iBARP;AAUA,OAAO,MAAMC,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,cADiB;AAEvBC,EAAAA,GAAG,EAAE,aAFkB;AAGvBC,EAAAA,QAAQ,EAAEN,eAAe,CAACO,KAHH;AAIvBC,EAAAA,MAAM,EAAE;AACNC,IAAAA,SAAS,EAAE;AADL,GAJe;AAOvBC,EAAAA,QAAQ,EAAE,CAACT,QAAQ,CAACU,OAAV,CAPa;AAQvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAEjB,cAAc,CAAC;AACpBiB,MAAAA,KAAK,EAAE,OADa;AAEpBC,MAAAA,WAAW,EAAE,iCAFO;AAGpBC,MAAAA,QAAQ,EAAE,IAHU;AAIpBC,MAAAA,YAAY,EAAE;AAJM,KAAD,CADhB;AAOLC,IAAAA,UAAU,EAAEpB,eAAe,CAAC;AAC1BgB,MAAAA,KAAK,EAAE,aADmB;AAE1BC,MAAAA,WAAW,EAAE,gCAFa;AAG1BC,MAAAA,QAAQ,EAAE,KAHgB;AAI1BG,MAAAA,QAAQ,EAAE;AAJgB,KAAD,CAPtB;AAaLC,IAAAA,SAAS,EAAErB,sBAAsB,EAb5B;AAcLsB,IAAAA,SAAS,EAAErB,mBAAmB,CAAC;AAC7BiB,MAAAA,YAAY,EAAE,kBADe;AAE7BK,MAAAA,aAAa,EAAE,OAFc;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAAD,CAdzB;AAmBLC,IAAAA,KAAK,EAAErB,eAAe,CAAC;AACrBY,MAAAA,WAAW,EAAE;AADQ,KAAD,CAnBjB;AAsBLU,IAAAA,cAAc,EAAEtB,eAAe,CAAC;AAC9BW,MAAAA,KAAK,EAAE,kBADuB;AAE9BC,MAAAA,WAAW,EAAE;AAFiB,KAAD;AAtB1B;AARgB,CAAlB","sourcesContent":["import {\n  createTextProp,\n  createTextStyle,\n  createRowDirectionProp,\n  createFieldNameProp,\n  COMPONENT_TYPES,\n  Triggers,\n  createColorProp,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Checkbox Row\",\n  tag: \"CheckboxRow\",\n  category: COMPONENT_TYPES.input,\n  layout: {\n    minHeight: 50,\n  },\n  triggers: [Triggers.OnPress],\n  props: {\n    label: createTextProp({\n      label: \"Label\",\n      description: \"Label to show with the checkbox\",\n      required: true,\n      defaultValue: \"First Option\",\n    }),\n    labelStyle: createTextStyle({\n      label: \"Label Style\",\n      description: \"Change the styles of the label\",\n      required: false,\n      editable: false,\n    }),\n    direction: createRowDirectionProp(),\n    fieldName: createFieldNameProp({\n      defaultValue: \"checkboxRowValue\",\n      valuePropName: \"value\",\n      handlerPropName: \"onPress\",\n    }),\n    color: createColorProp({\n      description: \"Color for the button (used when the checkbox is checked)\",\n    }),\n    uncheckedColor: createColorProp({\n      label: \"Unselected Color\",\n      description: \"Color for the button when the checkbox is unchecked\",\n    }),\n  },\n};\n"]}

package/lib/module/utilities.js

@@ -1,4 +1,5 @@
 import { StyleSheet } from "react-native";
+import { isString, isNumber } from "lodash";
 export function extractStyles(style) {
   const {
     color,
@@ -60,4 +61,13 @@ export function applyStyles(baseStyles, stylesToApply) {
 
   return flattenedStyles;
 }
+export function getValueForRadioButton(value) {
+  if (isString(value)) {
+    return value;
+  } else if (isNumber(value)) {
+    return String(value);
+  } else {
+    throw new Error(`Invalid value: ${value}`);
+  }
+}
 //# sourceMappingURL=utilities.js.map

package/lib/module/utilities.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utilities.ts"],"names":["StyleSheet","extractStyles","style","color","fontFamily","fontWeight","fontSize","lineHeight","letterSpacing","textTransform","textAlign","textDecorationLine","textDecorationColor","textDecorationStyle","viewStyles","flatten","textStyles","applyStyles","baseStyles","stylesToApply","flattenedStyles","key","value","Object","entries"],"mappings":"AAAA,SAASA,UAAT,QAAiD,cAAjD;AAEA,OAAO,SAASC,aAAT,CAAuBC,KAAvB,EAA8C;AACnD,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,UAFI;AAGJC,IAAAA,UAHI;AAIJC,IAAAA,QAJI;AAKJC,IAAAA,UALI;AAMJC,IAAAA,aANI;AAOJC,IAAAA,aAPI;AAQJC,IAAAA,SARI;AASJC,IAAAA,kBATI;AAUJC,IAAAA,mBAVI;AAWJC,IAAAA,mBAXI;AAYJ,OAAGC;AAZC,MAaFd,UAAU,CAACe,OAAX,CAAmBb,KAAK,IAAI,EAA5B,CAbJ;AAeA,QAAMc,UAAqB,GAAG;AAC5Bb,IAAAA,KAD4B;AAE5BC,IAAAA,UAF4B;AAG5BC,IAAAA,UAH4B;AAI5BC,IAAAA,QAJ4B;AAK5BC,IAAAA,UAL4B;AAM5BC,IAAAA,aAN4B;AAO5BC,IAAAA,aAP4B;AAQ5BC,IAAAA,SAR4B;AAS5BC,IAAAA,kBAT4B;AAU5BC,IAAAA,mBAV4B;AAW5BC,IAAAA;AAX4B,GAA9B;AAcA,SAAO;AAAEC,IAAAA,UAAF;AAAcE,IAAAA;AAAd,GAAP;AACD;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,WAAT,CACLC,UADK,EAELC,aAFK,EAGL;AACA,MAAI,CAACA,aAAL,EAAoB;AAClB;AACD;;AAED,QAAMC,eAAe,GAAGpB,UAAU,CAACe,OAAX,CAAmBG,UAAnB,CAAxB;;AAEA,OAAK,MAAM,CAACG,GAAD,EAAMC,KAAN,CAAX,IAA2BC,MAAM,CAACC,OAAP,CAAeL,aAAf,CAA3B,EAA0D;AACxD,QAAIG,KAAK,IAAI,IAAb,EAAmB;AACjBF,MAAAA,eAAe,CAACC,GAAD,CAAf,GAAuBC,KAAvB;AACD;AACF;;AAED,SAAOF,eAAP;AACD","sourcesContent":["import { StyleSheet, StyleProp, TextStyle } from \"react-native\";\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\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"]}
+{"version":3,"sources":["utilities.ts"],"names":["StyleSheet","isString","isNumber","extractStyles","style","color","fontFamily","fontWeight","fontSize","lineHeight","letterSpacing","textTransform","textAlign","textDecorationLine","textDecorationColor","textDecorationStyle","viewStyles","flatten","textStyles","applyStyles","baseStyles","stylesToApply","flattenedStyles","key","value","Object","entries","getValueForRadioButton","String","Error"],"mappings":"AAAA,SAASA,UAAT,QAAiD,cAAjD;AACA,SAASC,QAAT,EAAmBC,QAAnB,QAAmC,QAAnC;AAEA,OAAO,SAASC,aAAT,CAAuBC,KAAvB,EAA8C;AACnD,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,UAFI;AAGJC,IAAAA,UAHI;AAIJC,IAAAA,QAJI;AAKJC,IAAAA,UALI;AAMJC,IAAAA,aANI;AAOJC,IAAAA,aAPI;AAQJC,IAAAA,SARI;AASJC,IAAAA,kBATI;AAUJC,IAAAA,mBAVI;AAWJC,IAAAA,mBAXI;AAYJ,OAAGC;AAZC,MAaFhB,UAAU,CAACiB,OAAX,CAAmBb,KAAK,IAAI,EAA5B,CAbJ;AAeA,QAAMc,UAAqB,GAAG;AAC5Bb,IAAAA,KAD4B;AAE5BC,IAAAA,UAF4B;AAG5BC,IAAAA,UAH4B;AAI5BC,IAAAA,QAJ4B;AAK5BC,IAAAA,UAL4B;AAM5BC,IAAAA,aAN4B;AAO5BC,IAAAA,aAP4B;AAQ5BC,IAAAA,SAR4B;AAS5BC,IAAAA,kBAT4B;AAU5BC,IAAAA,mBAV4B;AAW5BC,IAAAA;AAX4B,GAA9B;AAcA,SAAO;AAAEC,IAAAA,UAAF;AAAcE,IAAAA;AAAd,GAAP;AACD;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,WAAT,CACLC,UADK,EAELC,aAFK,EAGL;AACA,MAAI,CAACA,aAAL,EAAoB;AAClB;AACD;;AAED,QAAMC,eAAe,GAAGtB,UAAU,CAACiB,OAAX,CAAmBG,UAAnB,CAAxB;;AAEA,OAAK,MAAM,CAACG,GAAD,EAAMC,KAAN,CAAX,IAA2BC,MAAM,CAACC,OAAP,CAAeL,aAAf,CAA3B,EAA0D;AACxD,QAAIG,KAAK,IAAI,IAAb,EAAmB;AACjBF,MAAAA,eAAe,CAACC,GAAD,CAAf,GAAuBC,KAAvB;AACD;AACF;;AAED,SAAOF,eAAP;AACD;AAED,OAAO,SAASK,sBAAT,CAAgCH,KAAhC,EAAwD;AAC7D,MAAIvB,QAAQ,CAACuB,KAAD,CAAZ,EAAqB;AACnB,WAAOA,KAAP;AACD,GAFD,MAEO,IAAItB,QAAQ,CAACsB,KAAD,CAAZ,EAAqB;AAC1B,WAAOI,MAAM,CAACJ,KAAD,CAAb;AACD,GAFM,MAEA;AACL,UAAM,IAAIK,KAAJ,CAAW,kBAAiBL,KAAM,EAAlC,CAAN;AACD;AACF","sourcesContent":["import { StyleSheet, StyleProp, TextStyle } from \"react-native\";\nimport { isString, isNumber } 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\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"]}

package/lib/typescript/src/components/RadioButton/RadioButton.d.ts

@@ -5,9 +5,9 @@ export declare type RadioButtonProps = {
     selected?: boolean;
     disabled?: boolean;
     color?: string;
-    value?: string;
+    value?: string | number;
     unselectedColor?: string;
-    onPress?: () => void;
+    onPress?: (value?: string) => void;
     style?: StyleProp<ViewStyle>;
     size?: number;
     selectedIcon?: string;

package/lib/typescript/src/components/RadioButton/RadioButtonGroup.d.ts

@@ -5,9 +5,9 @@ import { Direction } from "./context";
 export interface RadioButtonGroupProps {
     direction?: Direction;
     style?: StyleProp<ViewStyle>;
-    value?: string;
+    value: string;
     onValueChange?: (value: string) => void;
-    defaultValue?: string;
+    defaultValue?: string | number;
     theme: Theme;
     children: React.ReactNode;
 }

package/lib/typescript/src/components/RadioButton/RadioButtonRow.d.ts

@@ -8,7 +8,7 @@ export declare enum Direction {
 }
 export interface RadioButtonRowProps extends Omit<RadioButtonProps, "onPress"> {
     label: string | React.ReactNode;
-    value: string;
+    value: string | number;
     color?: string;
     unselectedColor?: string;
     labelContainerStyle: StyleProp<ViewStyle>;

package/lib/typescript/src/index.d.ts

@@ -27,7 +27,6 @@ export { default as Touchable } from "./components/Touchable";
 export { AccordionGroup, AccordionItem } from "./components/Accordion";
 export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
-export { TabView, TabViewItem } from "./components/TabView";
 export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
 export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
 export { default as Button } from "./components/DeprecatedButton";

package/lib/typescript/src/utilities.d.ts

@@ -16,3 +16,4 @@ export declare function extractStyles(style: StyleProp<any>): {
  * `const mergedStyles = StyleSheet.flatten([{ color: "red" }, { color: undefined }])`
  */
 export declare function applyStyles(baseStyles: Array<StyleProp<any>>, stylesToApply: StyleProp<any> | undefined): any;
+export declare function getValueForRadioButton(value: string | number): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "43.4.5-d442fc.1+d442fc18",
+  "version": "43.4.6-5320f5.0+5320f59e",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -54,8 +54,6 @@
     "lodash.omit": "^4.5.0",
     "lodash.tonumber": "^4.0.3",
     "react-native-modal-datetime-picker": "^13.0.0",
-    "react-native-pager-view": "^5.4.9",
-    "react-native-tab-view": "^3.1.1",
     "react-native-typography": "^1.4.1",
     "react-native-web-swiper": "^2.2.1"
   },
@@ -82,5 +80,5 @@
       ]
     ]
   },
-  "gitHead": "d442fc18bff113f1e3f9040d6df0e2e1215c16e1"
+  "gitHead": "5320f59e438f243322330aff344115c2e9eab3b9"
 }

package/src/components/RadioButton/RadioButton.js

@@ -1,16 +1,17 @@
 import * as React from "react";
 import Config from "../Config";
 import IconButton from "../IconButton";
+import { getValueForRadioButton } from "../../utilities";
 import { useRadioButtonGroupContext } from "./context";
-const RadioButton = ({ Icon, disabled = false, color, value, selected, unselectedColor, onPress = () => { }, size = Config.radioButtonSize, selectedIcon = "MaterialIcons/radio-button-checked", unselectedIcon = "MaterialIcons/radio-button-unchecked", style, ...rest }) => {
+const RadioButton = ({ Icon, disabled = false, color, value = "", selected, unselectedColor, onPress, size = Config.radioButtonSize, selectedIcon = "MaterialIcons/radio-button-checked", unselectedIcon = "MaterialIcons/radio-button-unchecked", style, ...rest }) => {
     const { value: contextValue, onValueChange } = useRadioButtonGroupContext();
+    const realValue = getValueForRadioButton(value);
+    const realContextValue = getValueForRadioButton(contextValue);
+    const isSelected = selected ?? realContextValue === realValue;
     const handlePress = () => {
-        onPress && onPress();
-        if (onValueChange && value) {
-            onValueChange(value);
-        }
+        onPress?.(realValue);
+        onValueChange?.(realValue);
     };
-    const isSelected = selected || (contextValue != null && contextValue === value);
     return (React.createElement(IconButton, { Icon: Icon, icon: isSelected ? selectedIcon : unselectedIcon, color: isSelected ? color : unselectedColor, disabled: disabled, onPress: handlePress, size: size, style: style, ...rest }));
 };
 export default RadioButton;

package/src/components/RadioButton/RadioButton.tsx

@@ -3,6 +3,7 @@ import { StyleProp, ViewStyle } from "react-native";
 
 import Config from "../Config";
 import IconButton from "../IconButton";
+import { getValueForRadioButton } from "../../utilities";
 import { useRadioButtonGroupContext } from "./context";
 
 import type { IconSlot } from "../../interfaces/Icon";
@@ -11,9 +12,9 @@ export type RadioButtonProps = {
   selected?: boolean;
   disabled?: boolean;
   color?: string;
-  value?: string;
+  value?: string | number;
   unselectedColor?: string;
-  onPress?: () => void;
+  onPress?: (value?: string) => void;
   style?: StyleProp<ViewStyle>;
   size?: number;
   selectedIcon?: string;
@@ -24,10 +25,10 @@ const RadioButton: React.FC<RadioButtonProps> = ({
   Icon,
   disabled = false,
   color,
-  value,
+  value = "",
   selected,
   unselectedColor,
-  onPress = () => {},
+  onPress,
   size = Config.radioButtonSize,
   selectedIcon = "MaterialIcons/radio-button-checked",
   unselectedIcon = "MaterialIcons/radio-button-unchecked",
@@ -36,17 +37,15 @@ const RadioButton: React.FC<RadioButtonProps> = ({
 }) => {
   const { value: contextValue, onValueChange } = useRadioButtonGroupContext();
 
-  const handlePress = () => {
-    onPress && onPress();
+  const realValue = getValueForRadioButton(value);
+  const realContextValue = getValueForRadioButton(contextValue);
+  const isSelected = selected ?? realContextValue === realValue;
 
-    if (onValueChange && value) {
-      onValueChange(value);
-    }
+  const handlePress = () => {
+    onPress?.(realValue);
+    onValueChange?.(realValue);
   };
 
-  const isSelected =
-    selected || (contextValue != null && contextValue === value);
-
   return (
     <IconButton
       Icon={Icon}

package/src/components/RadioButton/RadioButtonGroup.js

@@ -1,22 +1,22 @@
 import * as React from "react";
 import { View } from "react-native";
+import { getValueForRadioButton } from "../../utilities";
 import { radioButtonGroupContext, Direction } from "./context";
 const { Provider } = radioButtonGroupContext;
-const RadioButtonGroup = ({ direction = Direction.Vertical, value, onValueChange = () => { }, defaultValue, style, children, ...rest }) => {
-    const [internalValue, setInternalValue] = React.useState(value || defaultValue);
+const RadioButtonGroup = ({ direction = Direction.Vertical, value = "", onValueChange, defaultValue = "", style, children, ...rest }) => {
+    const [internalValue, setInternalValue] = React.useState("");
     React.useEffect(() => {
-        if (value != null) {
-            setInternalValue(value);
-        }
+        const realValue = getValueForRadioButton(value);
+        setInternalValue(realValue);
     }, [value]);
     React.useEffect(() => {
-        if (defaultValue != null) {
-            setInternalValue(defaultValue);
-        }
+        const realDefaultValue = getValueForRadioButton(defaultValue);
+        setInternalValue(realDefaultValue);
     }, [defaultValue]);
     const handleValueChange = (newValue) => {
-        setInternalValue(newValue);
-        onValueChange(newValue);
+        const realNewValue = getValueForRadioButton(newValue);
+        setInternalValue(realNewValue);
+        onValueChange?.(realNewValue);
     };
     const _containerStyle = [
         {

package/src/components/RadioButton/RadioButtonGroup.tsx

@@ -1,13 +1,14 @@
 import * as React from "react";
 import { View, StyleProp, ViewStyle } from "react-native";
 import type { Theme } from "../../styles/DefaultTheme";
+import { getValueForRadioButton } from "../../utilities";
 import { radioButtonGroupContext, Direction } from "./context";
 export interface RadioButtonGroupProps {
   direction?: Direction;
   style?: StyleProp<ViewStyle>;
-  value?: string;
+  value: string;
   onValueChange?: (value: string) => void;
-  defaultValue?: string;
+  defaultValue?: string | number;
   theme: Theme;
   children: React.ReactNode;
 }
@@ -16,32 +17,32 @@ const { Provider } = radioButtonGroupContext;
 
 const RadioButtonGroup: React.FC<RadioButtonGroupProps> = ({
   direction = Direction.Vertical,
-  value,
-  onValueChange = () => {},
-  defaultValue,
+  value = "",
+  onValueChange,
+  defaultValue = "",
   style,
   children,
   ...rest
 }) => {
-  const [internalValue, setInternalValue] = React.useState<string | undefined>(
-    value || defaultValue
-  );
+  const [internalValue, setInternalValue] = React.useState<string>("");
 
   React.useEffect(() => {
-    if (value != null) {
-      setInternalValue(value);
-    }
+    const realValue = getValueForRadioButton(value);
+
+    setInternalValue(realValue);
   }, [value]);
 
   React.useEffect(() => {
-    if (defaultValue != null) {
-      setInternalValue(defaultValue);
-    }
+    const realDefaultValue = getValueForRadioButton(defaultValue);
+
+    setInternalValue(realDefaultValue);
   }, [defaultValue]);
 
-  const handleValueChange = (newValue: string) => {
-    setInternalValue(newValue);
-    onValueChange(newValue);
+  const handleValueChange = (newValue: string | number) => {
+    const realNewValue = getValueForRadioButton(newValue);
+
+    setInternalValue(realNewValue);
+    onValueChange?.(realNewValue);
   };
 
   const _containerStyle: StyleProp<ViewStyle> = [

package/src/components/RadioButton/RadioButtonRow.js

@@ -5,7 +5,7 @@ import Text from "../Text";
 import { useRadioButtonGroupContext } from "./context";
 import { Direction as GroupDirection } from "./context";
 import Touchable from "../Touchable";
-import { extractStyles } from "../../utilities";
+import { extractStyles, getValueForRadioButton } from "../../utilities";
 export var Direction;
 (function (Direction) {
     Direction["Row"] = "row";
@@ -30,11 +30,14 @@ const renderLabel = (value, labelStyle, textStyle) => {
         return React.createElement(React.Fragment, null, value);
     }
 };
-const RadioButtonRow = ({ Icon, label, value, color, unselectedColor, onPress = () => { }, labelContainerStyle, labelStyle, radioButtonStyle, direction = Direction.Row, selected, disabled, style, ...rest }) => {
+const RadioButtonRow = ({ Icon, label, value = "", color, unselectedColor, onPress, labelContainerStyle, labelStyle, radioButtonStyle, direction = Direction.Row, selected, disabled, style, ...rest }) => {
     const { value: contextValue, onValueChange, direction: parentDirection, } = useRadioButtonGroupContext();
+    const realValue = getValueForRadioButton(value);
+    const realContextValue = getValueForRadioButton(contextValue);
+    const isSelected = selected ?? realContextValue === realValue;
     const handlePress = () => {
-        onPress(value);
-        onValueChange && onValueChange(value);
+        onPress?.(realValue);
+        onValueChange?.(realValue);
     };
     const { textStyles, viewStyles } = extractStyles(style);
     return (React.createElement(Touchable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
@@ -49,7 +52,7 @@ const RadioButtonRow = ({ Icon, label, value, color, unselectedColor, onPress =
                 flex: 1,
                 alignItems: getRadioButtonAlignment(parentDirection, direction),
             } },
-            React.createElement(RadioButton, { Icon: Icon, selected: selected || (contextValue != null && contextValue === value), color: color, unselectedColor: unselectedColor, onPress: handlePress, style: radioButtonStyle }))));
+            React.createElement(RadioButton, { Icon: Icon, selected: isSelected, value: realValue, color: color, unselectedColor: unselectedColor, style: radioButtonStyle }))));
 };
 const styles = StyleSheet.create({
     mainParent: {

package/src/components/RadioButton/RadioButtonRow.tsx

@@ -13,7 +13,7 @@ import { useRadioButtonGroupContext } from "./context";
 import type { IconSlot } from "../../interfaces/Icon";
 import { Direction as GroupDirection } from "./context";
 import Touchable from "../Touchable";
-import { extractStyles } from "../../utilities";
+import { extractStyles, getValueForRadioButton } from "../../utilities";
 
 export enum Direction {
   Row = "row",
@@ -22,7 +22,7 @@ export enum Direction {
 
 export interface RadioButtonRowProps extends Omit<RadioButtonProps, "onPress"> {
   label: string | React.ReactNode;
-  value: string; // A string that this radio button row represents when selected
+  value: string | number; // A string (or number that will be parsed String(number)) that this radio button row represents when selected
   color?: string;
   unselectedColor?: string;
   labelContainerStyle: StyleProp<ViewStyle>;
@@ -60,10 +60,10 @@ const renderLabel = (
 const RadioButtonRow: React.FC<RadioButtonRowProps & IconSlot> = ({
   Icon,
   label,
-  value,
+  value = "",
   color,
   unselectedColor,
-  onPress = () => {},
+  onPress,
   labelContainerStyle,
   labelStyle,
   radioButtonStyle,
@@ -79,9 +79,13 @@ const RadioButtonRow: React.FC<RadioButtonRowProps & IconSlot> = ({
     direction: parentDirection,
   } = useRadioButtonGroupContext();
 
+  const realValue = getValueForRadioButton(value);
+  const realContextValue = getValueForRadioButton(contextValue);
+  const isSelected = selected ?? realContextValue === realValue;
+
   const handlePress = () => {
-    onPress(value);
-    onValueChange && onValueChange(value);
+    onPress?.(realValue);
+    onValueChange?.(realValue);
   };
 
   const { textStyles, viewStyles } = extractStyles(style);
@@ -112,12 +116,10 @@ const RadioButtonRow: React.FC<RadioButtonRowProps & IconSlot> = ({
       >
         <RadioButton
           Icon={Icon}
-          selected={
-            selected || (contextValue != null && contextValue === value)
-          }
+          selected={isSelected}
+          value={realValue}
           color={color}
           unselectedColor={unselectedColor}
-          onPress={handlePress}
           style={radioButtonStyle}
         />
       </View>

package/src/index.js

@@ -27,7 +27,6 @@ export { default as Touchable } from "./components/Touchable";
 export { AccordionGroup, AccordionItem } from "./components/Accordion";
 export { ActionSheet, ActionSheetItem, ActionSheetCancel, } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
-export { TabView, TabViewItem } from "./components/TabView";
 export { Center, Circle, Square, Row, Stack, Spacer, } from "./components/Layout";
 export { RadioButton, RadioButtonGroup, RadioButtonRow, RadioButtonFieldGroup, } from "./components/RadioButton/index";
 /* Deprecated: Fix or Delete!  */

package/src/index.tsx

@@ -32,7 +32,6 @@ export {
   ActionSheetCancel,
 } from "./components/ActionSheet";
 export { Swiper, SwiperItem } from "./components/Swiper";
-export { TabView, TabViewItem } from "./components/TabView";
 
 export {
   Center,

package/src/mappings/CheckboxRow.js

@@ -22,7 +22,7 @@ export const SEED_DATA = {
         }),
         direction: createRowDirectionProp(),
         fieldName: createFieldNameProp({
-            defaultValue: "checkboxValue",
+            defaultValue: "checkboxRowValue",
             valuePropName: "value",
             handlerPropName: "onPress",
         }),

package/src/mappings/CheckboxRow.ts

@@ -31,7 +31,7 @@ export const SEED_DATA = {
     }),
     direction: createRowDirectionProp(),
     fieldName: createFieldNameProp({
-      defaultValue: "checkboxValue",
+      defaultValue: "checkboxRowValue",
       valuePropName: "value",
       handlerPropName: "onPress",
     }),

package/src/utilities.js

@@ -1,4 +1,5 @@
 import { StyleSheet } from "react-native";
+import { isString, isNumber } from "lodash";
 export function extractStyles(style) {
     const { color, fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textTransform, textAlign, textDecorationLine, textDecorationColor, textDecorationStyle, ...viewStyles } = StyleSheet.flatten(style || {});
     const textStyles = {
@@ -40,3 +41,14 @@ export function applyStyles(baseStyles, stylesToApply) {
     }
     return flattenedStyles;
 }
+export function getValueForRadioButton(value) {
+    if (isString(value)) {
+        return value;
+    }
+    else if (isNumber(value)) {
+        return String(value);
+    }
+    else {
+        throw new Error(`Invalid value: ${value}`);
+    }
+}

package/src/utilities.ts

@@ -1,4 +1,5 @@
 import { StyleSheet, StyleProp, TextStyle } from "react-native";
+import { isString, isNumber } from "lodash";
 
 export function extractStyles(style: StyleProp<any>) {
   const {
@@ -63,3 +64,13 @@ export function applyStyles(
 
   return flattenedStyles;
 }
+
+export function getValueForRadioButton(value: string | number) {
+  if (isString(value)) {
+    return value;
+  } else if (isNumber(value)) {
+    return String(value);
+  } else {
+    throw new Error(`Invalid value: ${value}`);
+  }
+}

package/lib/commonjs/components/TabView/TabView.js

@@ -1,103 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var React = _interopRequireWildcard(require("react"));
-
-var _reactNativeTabView = require("react-native-tab-view");
-
-var _TabViewItem = _interopRequireDefault(require("./TabViewItem"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-const TabViewComponent = _ref => {
-  let {
-    Icon,
-    tabBarPosition,
-    keyboardDismissMode,
-    swipeEnabled,
-    scrollEnabled,
-    activeColor,
-    inactiveColor,
-    pressColor,
-    indicatorColor,
-    style,
-    children
-  } = _ref;
-  const [index, setIndex] = React.useState(0);
-  const [routes, setRoutes] = React.useState([]);
-  const [tabScenes, setTabScenes] = React.useState({});
-  React.useEffect(() => {
-    const newRoutes = [];
-    const scenes = {};
-    React.Children.toArray(children).filter(child => child.type === _TabViewItem.default).forEach(child => {
-      var _child$props;
-
-      if (child !== null && child !== void 0 && (_child$props = child.props) !== null && _child$props !== void 0 && _child$props.id) {
-        var _child$props2, _child$props3;
-
-        newRoutes.push({
-          key: child === null || child === void 0 ? void 0 : (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.id,
-          ...(child === null || child === void 0 ? void 0 : child.props)
-        });
-
-        scenes[child === null || child === void 0 ? void 0 : (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.id] = () => child;
-      }
-    });
-    setRoutes(newRoutes);
-    setTabScenes(scenes);
-  }, [children]);
-
-  const indexChangeHandler = i => setIndex(i);
-
-  const renderTabBar = props => {
-    console.log(props);
-    return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, props, {
-      activeColor: activeColor,
-      inactiveColor: inactiveColor,
-      pressColor: pressColor,
-      scrollEnabled: scrollEnabled,
-      indicatorStyle: {
-        backgroundColor: indicatorColor
-      },
-      renderIcon: _ref2 => {
-        let {
-          route,
-          color
-        } = _ref2;
-        return route !== null && route !== void 0 && route.icon ? /*#__PURE__*/React.createElement(Icon, {
-          name: route.icon,
-          color: color,
-          size: 36
-        }) : null;
-      },
-      style: style
-    }));
-  };
-
-  return /*#__PURE__*/React.createElement(_reactNativeTabView.TabView, {
-    navigationState: {
-      index,
-      routes
-    },
-    renderScene: (0, _reactNativeTabView.SceneMap)(tabScenes),
-    renderTabBar: renderTabBar,
-    onIndexChange: indexChangeHandler,
-    tabBarPosition: tabBarPosition,
-    keyboardDismissMode: keyboardDismissMode,
-    swipeEnabled: swipeEnabled
-  });
-};
-
-var _default = TabViewComponent;
-exports.default = _default;
-//# sourceMappingURL=TabView.js.map

package/lib/commonjs/components/TabView/TabView.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["TabView.tsx"],"names":["TabViewComponent","Icon","tabBarPosition","keyboardDismissMode","swipeEnabled","scrollEnabled","activeColor","inactiveColor","pressColor","indicatorColor","style","children","index","setIndex","React","useState","routes","setRoutes","tabScenes","setTabScenes","useEffect","newRoutes","scenes","Children","toArray","filter","child","type","TabViewItem","forEach","props","id","push","key","indexChangeHandler","i","renderTabBar","console","log","backgroundColor","route","color","icon"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { StyleProp, TextStyle, ViewStyle } from \"react-native\";\nimport { TabView, TabBar, SceneMap } from \"react-native-tab-view\";\n\n// import { withTheme } from \"../../theming\";\nimport TabViewItem from \"./TabViewItem\";\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\ntype TabBarPosition = \"top\" | \"bottom\";\ntype KeyboardDismissMode = \"none\" | \"auto\" | \"on-drag\";\n\ntype TabViewProps = {\n  tabBarPosition?: TabBarPosition;\n  keyboardDismissMode?: KeyboardDismissMode;\n  swipeEnabled?: boolean;\n  scrollEnabled?: boolean;\n  activeColor?: string;\n  inactiveColor?: string;\n  pressColor?: string;\n  indicatorColor?: string;\n  style?: StyleProp<TextStyle | ViewStyle>;\n  children: React.ReactNode;\n} & IconSlot;\n\nconst TabViewComponent = ({\n  Icon,\n  tabBarPosition,\n  keyboardDismissMode,\n  swipeEnabled,\n  scrollEnabled,\n  activeColor,\n  inactiveColor,\n  pressColor,\n  indicatorColor,\n  style,\n  children,\n}: TabViewProps) => {\n  const [index, setIndex] = React.useState(0);\n  const [routes, setRoutes] = React.useState([]);\n  const [tabScenes, setTabScenes] = React.useState({});\n\n  React.useEffect(() => {\n    const newRoutes: any = [];\n    const scenes: any = {};\n\n    React.Children.toArray(children)\n      .filter((child: any) => child.type === TabViewItem)\n      .forEach((child: any) => {\n        if (child?.props?.id) {\n          newRoutes.push({\n            key: child?.props?.id,\n            ...child?.props,\n          });\n          scenes[child?.props?.id] = () => child;\n        }\n      });\n\n    setRoutes(newRoutes);\n    setTabScenes(scenes);\n  }, [children]);\n\n  const indexChangeHandler = (i: any) => setIndex(i);\n\n  const renderTabBar = (props: any) => {\n    console.log(props);\n    return (\n      <TabBar\n        {...props}\n        activeColor={activeColor}\n        inactiveColor={inactiveColor}\n        pressColor={pressColor}\n        scrollEnabled={scrollEnabled}\n        indicatorStyle={{ backgroundColor: indicatorColor }}\n        renderIcon={({ route, color }) =>\n          route?.icon ? (\n            <Icon name={route.icon} color={color} size={36} />\n          ) : null\n        }\n        style={style}\n      />\n    );\n  };\n\n  return (\n    <TabView\n      navigationState={{ index, routes }}\n      renderScene={SceneMap(tabScenes)}\n      renderTabBar={renderTabBar}\n      onIndexChange={indexChangeHandler}\n      tabBarPosition={tabBarPosition}\n      keyboardDismissMode={keyboardDismissMode}\n      swipeEnabled={swipeEnabled}\n    />\n  );\n};\n\nexport default TabViewComponent;\n"]}

package/lib/commonjs/components/TabView/TabViewItem.js

@@ -1,27 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-const TabViewItem = _ref => {
-  let {
-    title,
-    id,
-    icon,
-    children,
-    accessibilityLabel
-  } = _ref;
-  console.log({
-    title,
-    id,
-    icon,
-    accessibilityLabel
-  });
-  return children;
-};
-
-var _default = TabViewItem;
-exports.default = _default;
-//# sourceMappingURL=TabViewItem.js.map

package/lib/commonjs/components/TabView/TabViewItem.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["TabViewItem.tsx"],"names":["TabViewItem","title","id","icon","children","accessibilityLabel","console","log"],"mappings":";;;;;;;AASA,MAAMA,WAAW,GAAG,QAMI;AAAA,MANH;AACnBC,IAAAA,KADmB;AAEnBC,IAAAA,EAFmB;AAGnBC,IAAAA,IAHmB;AAInBC,IAAAA,QAJmB;AAKnBC,IAAAA;AALmB,GAMG;AACtBC,EAAAA,OAAO,CAACC,GAAR,CAAY;AAAEN,IAAAA,KAAF;AAASC,IAAAA,EAAT;AAAaC,IAAAA,IAAb;AAAmBE,IAAAA;AAAnB,GAAZ;AACA,SAAOD,QAAP;AACD,CATD;;eAWeJ,W","sourcesContent":["import React from \"react\";\ninterface TabViewItemProps {\n  title: string;\n  id: string;\n  icon: string;\n  accessibilityLabel: string;\n  children: React.ReactNode;\n}\n\nconst TabViewItem = ({\n  title,\n  id,\n  icon,\n  children,\n  accessibilityLabel,\n}: TabViewItemProps) => {\n  console.log({ title, id, icon, accessibilityLabel });\n  return children;\n};\n\nexport default TabViewItem;\n"]}