@draftbit/core 43.2.5-dd3a98.3 → 43.2.6-c2ac06.0

package/src/mappings/Checkbox.js

@@ -3,7 +3,7 @@ export const SEED_DATA = {
     name: "Checkbox",
     tag: "Checkbox",
     category: COMPONENT_TYPES.input,
-    triggers: [Triggers.OnPress],
+    triggers: [Triggers.OnPress, Triggers.OnCheck, Triggers.OnUncheck],
     props: {
         fieldName: createFieldNameProp({
             defaultValue: "checkboxValue",

package/src/mappings/Checkbox.ts

@@ -13,7 +13,7 @@ export const SEED_DATA = {
   name: "Checkbox",
   tag: "Checkbox",
   category: COMPONENT_TYPES.input,
-  triggers: [Triggers.OnPress],
+  triggers: [Triggers.OnPress, Triggers.OnCheck, Triggers.OnUncheck],
   props: {
     fieldName: createFieldNameProp({
       defaultValue: "checkboxValue",

package/lib/commonjs/components/ToggleButton.js

@@ -1,86 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var React = _interopRequireWildcard(require("react"));
-
-var _theming = require("../theming");
-
-var _reactNative = require("react-native");
-
-var _IconButton = _interopRequireDefault(require("./IconButton"));
-
-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 ToggleButton = _ref => {
-  let {
-    Icon,
-    icon,
-    toggled = false,
-    onPress = () => {},
-    defaultValue,
-    disabled = false,
-    color = "primary",
-    colorSecondary = "surface",
-    borderColor = "divider",
-    iconSize = 25,
-    width = 50,
-    height = 50,
-    theme: {
-      colors
-    },
-    style,
-    ...rest
-  } = _ref;
-  const [internalValue, setInternalValue] = React.useState(toggled || defaultValue || false);
-  React.useEffect(() => {
-    if (toggled != null) {
-      setInternalValue(toggled);
-    }
-  }, [toggled]);
-  React.useEffect(() => {
-    if (defaultValue != null) {
-      setInternalValue(defaultValue);
-    }
-  }, [defaultValue]);
-
-  const handlePress = () => {
-    setInternalValue(!internalValue);
-    onPress(!internalValue);
-  };
-
-  return /*#__PURE__*/React.createElement(_IconButton.default, _extends({
-    Icon: Icon,
-    icon: icon,
-    size: iconSize,
-    color: internalValue ? colors[color] : colors[colorSecondary],
-    onPress: handlePress,
-    disabled: disabled,
-    style: [styles.mainContainer, {
-      width,
-      height,
-      backgroundColor: internalValue ? colors[colorSecondary] : colors[color],
-      borderColor: colors[borderColor]
-    }, style]
-  }, rest));
-};
-
-const styles = _reactNative.StyleSheet.create({
-  mainContainer: {
-    borderWidth: 1
-  }
-});
-
-var _default = (0, _theming.withTheme)(ToggleButton);
-
-exports.default = _default;
-//# sourceMappingURL=ToggleButton.js.map

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

@@ -1 +0,0 @@
-{"version":3,"sources":["ToggleButton.tsx"],"names":["ToggleButton","Icon","icon","toggled","onPress","defaultValue","disabled","color","colorSecondary","borderColor","iconSize","width","height","theme","colors","style","rest","internalValue","setInternalValue","React","useState","useEffect","handlePress","styles","mainContainer","backgroundColor","StyleSheet","create","borderWidth"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;;;AAoBA,MAAMA,YAA6B,GAAG,QAgBhC;AAAA,MAhBiC;AACrCC,IAAAA,IADqC;AAErCC,IAAAA,IAFqC;AAGrCC,IAAAA,OAAO,GAAG,KAH2B;AAIrCC,IAAAA,OAAO,GAAG,MAAM,CAAE,CAJmB;AAKrCC,IAAAA,YALqC;AAMrCC,IAAAA,QAAQ,GAAG,KAN0B;AAOrCC,IAAAA,KAAK,GAAG,SAP6B;AAQrCC,IAAAA,cAAc,GAAG,SARoB;AASrCC,IAAAA,WAAW,GAAG,SATuB;AAUrCC,IAAAA,QAAQ,GAAG,EAV0B;AAWrCC,IAAAA,KAAK,GAAG,EAX6B;AAYrCC,IAAAA,MAAM,GAAG,EAZ4B;AAarCC,IAAAA,KAAK,EAAE;AAAEC,MAAAA;AAAF,KAb8B;AAcrCC,IAAAA,KAdqC;AAerC,OAAGC;AAfkC,GAgBjC;AACJ,QAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoCC,KAAK,CAACC,QAAN,CACxCjB,OAAO,IAAIE,YAAX,IAA2B,KADa,CAA1C;AAIAc,EAAAA,KAAK,CAACE,SAAN,CAAgB,MAAM;AACpB,QAAIlB,OAAO,IAAI,IAAf,EAAqB;AACnBe,MAAAA,gBAAgB,CAACf,OAAD,CAAhB;AACD;AACF,GAJD,EAIG,CAACA,OAAD,CAJH;AAMAgB,EAAAA,KAAK,CAACE,SAAN,CAAgB,MAAM;AACpB,QAAIhB,YAAY,IAAI,IAApB,EAA0B;AACxBa,MAAAA,gBAAgB,CAACb,YAAD,CAAhB;AACD;AACF,GAJD,EAIG,CAACA,YAAD,CAJH;;AAMA,QAAMiB,WAAW,GAAG,MAAM;AACxBJ,IAAAA,gBAAgB,CAAC,CAACD,aAAF,CAAhB;AACAb,IAAAA,OAAO,CAAC,CAACa,aAAF,CAAP;AACD,GAHD;;AAKA,sBACE,oBAAC,mBAAD;AACE,IAAA,IAAI,EAAEhB,IADR;AAEE,IAAA,IAAI,EAAEC,IAFR;AAGE,IAAA,IAAI,EAAEQ,QAHR;AAIE,IAAA,KAAK,EAAEO,aAAa,GAAGH,MAAM,CAACP,KAAD,CAAT,GAAmBO,MAAM,CAACN,cAAD,CAJ/C;AAKE,IAAA,OAAO,EAAEc,WALX;AAME,IAAA,QAAQ,EAAEhB,QANZ;AAOE,IAAA,KAAK,EAAE,CACLiB,MAAM,CAACC,aADF,EAEL;AACEb,MAAAA,KADF;AAEEC,MAAAA,MAFF;AAGEa,MAAAA,eAAe,EAAER,aAAa,GAC1BH,MAAM,CAACN,cAAD,CADoB,GAE1BM,MAAM,CAACP,KAAD,CALZ;AAMEE,MAAAA,WAAW,EAAEK,MAAM,CAACL,WAAD;AANrB,KAFK,EAULM,KAVK;AAPT,KAmBMC,IAnBN,EADF;AAuBD,CA7DD;;AA+DA,MAAMO,MAAM,GAAGG,wBAAWC,MAAX,CAAkB;AAC/BH,EAAAA,aAAa,EAAE;AACbI,IAAAA,WAAW,EAAE;AADA;AADgB,CAAlB,CAAf;;eAMe,wBAAU5B,YAAV,C","sourcesContent":["import * as React from \"react\";\nimport { withTheme } from \"../theming\";\nimport { colorTypes } from \"@draftbit/types\";\nimport { StyleProp, StyleSheet, ViewStyle } from \"react-native\";\nimport IconButton from \"./IconButton\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\n\ntype Props = {\n  icon: string;\n  toggled?: boolean;\n  onPress?: (value: boolean) => void;\n  defaultValue?: boolean;\n  disabled?: boolean;\n  color?: colorTypes;\n  colorSecondary?: colorTypes;\n  borderColor?: colorTypes;\n  iconSize?: number;\n  width?: number;\n  height?: number;\n  style?: StyleProp<ViewStyle>;\n  theme: Theme;\n} & IconSlot;\n\nconst ToggleButton: React.FC<Props> = ({\n  Icon,\n  icon,\n  toggled = false,\n  onPress = () => {},\n  defaultValue,\n  disabled = false,\n  color = \"primary\",\n  colorSecondary = \"surface\",\n  borderColor = \"divider\",\n  iconSize = 25,\n  width = 50,\n  height = 50,\n  theme: { colors },\n  style,\n  ...rest\n}) => {\n  const [internalValue, setInternalValue] = React.useState<boolean>(\n    toggled || defaultValue || false\n  );\n\n  React.useEffect(() => {\n    if (toggled != null) {\n      setInternalValue(toggled);\n    }\n  }, [toggled]);\n\n  React.useEffect(() => {\n    if (defaultValue != null) {\n      setInternalValue(defaultValue);\n    }\n  }, [defaultValue]);\n\n  const handlePress = () => {\n    setInternalValue(!internalValue);\n    onPress(!internalValue);\n  };\n\n  return (\n    <IconButton\n      Icon={Icon}\n      icon={icon}\n      size={iconSize}\n      color={internalValue ? colors[color] : colors[colorSecondary]}\n      onPress={handlePress}\n      disabled={disabled}\n      style={[\n        styles.mainContainer,\n        {\n          width,\n          height,\n          backgroundColor: internalValue\n            ? colors[colorSecondary]\n            : colors[color],\n          borderColor: colors[borderColor],\n        },\n        style,\n      ]}\n      {...rest}\n    />\n  );\n};\n\nconst styles = StyleSheet.create({\n  mainContainer: {\n    borderWidth: 1,\n  },\n});\n\nexport default withTheme(ToggleButton);\n"]}

package/lib/commonjs/mappings/ToggleButton.js

@@ -1,60 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SEED_DATA = void 0;
-
-var _types = require("@draftbit/types");
-
-const SEED_DATA = {
-  name: "Toggle Button",
-  tag: "ToggleButton",
-  category: _types.COMPONENT_TYPES.button,
-  layout: {},
-  triggers: [_types.Triggers.OnPress],
-  props: {
-    onPress: (0, _types.createActionProp)(),
-    icon: (0, _types.createIconProp)({
-      required: true
-    }),
-    iconSize: (0, _types.createIconSizeProp)(),
-    fieldName: (0, _types.createFieldNameProp)({
-      defaultValue: false,
-      valuePropName: "toggled"
-    }),
-    disabled: (0, _types.createBoolProp)({
-      label: "Disabled",
-      description: "Whether the button should be disabled",
-      group: _types.GROUPS.basic
-    }),
-    color: (0, _types.createColorProp)({
-      group: _types.GROUPS.basic
-    }),
-    colorSecondary: (0, _types.createColorProp)({
-      label: "Secondary Color",
-      group: _types.GROUPS.basic
-    }),
-    borderColor: (0, _types.createColorProp)({
-      label: "Border Color",
-      group: _types.GROUPS.basic
-    }),
-    width: (0, _types.createStaticNumberProp)({
-      label: "Width",
-      description: "Width",
-      defaultValue: 50
-    }),
-    height: (0, _types.createStaticNumberProp)({
-      label: "Height",
-      description: "Height",
-      defaultValue: 50
-    }),
-    toggled: (0, _types.createBoolProp)({
-      label: "Toggled",
-      description: "Whether the button should show the toggled state",
-      defaultValue: false
-    })
-  }
-};
-exports.SEED_DATA = SEED_DATA;
-//# sourceMappingURL=ToggleButton.js.map

package/lib/commonjs/mappings/ToggleButton.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["ToggleButton.ts"],"names":["SEED_DATA","name","tag","category","COMPONENT_TYPES","button","layout","triggers","Triggers","OnPress","props","onPress","icon","required","iconSize","fieldName","defaultValue","valuePropName","disabled","label","description","group","GROUPS","basic","color","colorSecondary","borderColor","width","height","toggled"],"mappings":";;;;;;;AAAA;;AAaO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,eADiB;AAEvBC,EAAAA,GAAG,EAAE,cAFkB;AAGvBC,EAAAA,QAAQ,EAAEC,uBAAgBC,MAHH;AAIvBC,EAAAA,MAAM,EAAE,EAJe;AAKvBC,EAAAA,QAAQ,EAAE,CAACC,gBAASC,OAAV,CALa;AAMvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE,8BADJ;AAELC,IAAAA,IAAI,EAAE,2BAAe;AACnBC,MAAAA,QAAQ,EAAE;AADS,KAAf,CAFD;AAKLC,IAAAA,QAAQ,EAAE,gCALL;AAMLC,IAAAA,SAAS,EAAE,gCAAoB;AAC7BC,MAAAA,YAAY,EAAE,KADe;AAE7BC,MAAAA,aAAa,EAAE;AAFc,KAApB,CANN;AAULC,IAAAA,QAAQ,EAAE,2BAAe;AACvBC,MAAAA,KAAK,EAAE,UADgB;AAEvBC,MAAAA,WAAW,EAAE,uCAFU;AAGvBC,MAAAA,KAAK,EAAEC,cAAOC;AAHS,KAAf,CAVL;AAeLC,IAAAA,KAAK,EAAE,4BAAgB;AACrBH,MAAAA,KAAK,EAAEC,cAAOC;AADO,KAAhB,CAfF;AAkBLE,IAAAA,cAAc,EAAE,4BAAgB;AAC9BN,MAAAA,KAAK,EAAE,iBADuB;AAE9BE,MAAAA,KAAK,EAAEC,cAAOC;AAFgB,KAAhB,CAlBX;AAsBLG,IAAAA,WAAW,EAAE,4BAAgB;AAC3BP,MAAAA,KAAK,EAAE,cADoB;AAE3BE,MAAAA,KAAK,EAAEC,cAAOC;AAFa,KAAhB,CAtBR;AA0BLI,IAAAA,KAAK,EAAE,mCAAuB;AAC5BR,MAAAA,KAAK,EAAE,OADqB;AAE5BC,MAAAA,WAAW,EAAE,OAFe;AAG5BJ,MAAAA,YAAY,EAAE;AAHc,KAAvB,CA1BF;AA+BLY,IAAAA,MAAM,EAAE,mCAAuB;AAC7BT,MAAAA,KAAK,EAAE,QADsB;AAE7BC,MAAAA,WAAW,EAAE,QAFgB;AAG7BJ,MAAAA,YAAY,EAAE;AAHe,KAAvB,CA/BH;AAoCLa,IAAAA,OAAO,EAAE,2BAAe;AACtBV,MAAAA,KAAK,EAAE,SADe;AAEtBC,MAAAA,WAAW,EAAE,kDAFS;AAGtBJ,MAAAA,YAAY,EAAE;AAHQ,KAAf;AApCJ;AANgB,CAAlB","sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  createIconProp,\n  createBoolProp,\n  createColorProp,\n  createStaticNumberProp,\n  createFieldNameProp,\n  createIconSizeProp,\n  createActionProp,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Toggle Button\",\n  tag: \"ToggleButton\",\n  category: COMPONENT_TYPES.button,\n  layout: {},\n  triggers: [Triggers.OnPress],\n  props: {\n    onPress: createActionProp(),\n    icon: createIconProp({\n      required: true,\n    }),\n    iconSize: createIconSizeProp(),\n    fieldName: createFieldNameProp({\n      defaultValue: false,\n      valuePropName: \"toggled\",\n    }),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      description: \"Whether the button should be disabled\",\n      group: GROUPS.basic,\n    }),\n    color: createColorProp({\n      group: GROUPS.basic,\n    }),\n    colorSecondary: createColorProp({\n      label: \"Secondary Color\",\n      group: GROUPS.basic,\n    }),\n    borderColor: createColorProp({\n      label: \"Border Color\",\n      group: GROUPS.basic,\n    }),\n    width: createStaticNumberProp({\n      label: \"Width\",\n      description: \"Width\",\n      defaultValue: 50,\n    }),\n    height: createStaticNumberProp({\n      label: \"Height\",\n      description: \"Height\",\n      defaultValue: 50,\n    }),\n    toggled: createBoolProp({\n      label: \"Toggled\",\n      description: \"Whether the button should show the toggled state\",\n      defaultValue: false,\n    }),\n  },\n};\n"]}

package/lib/module/components/ToggleButton.js

@@ -1,67 +0,0 @@
-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); }
-
-import * as React from "react";
-import { withTheme } from "../theming";
-import { StyleSheet } from "react-native";
-import IconButton from "./IconButton";
-
-const ToggleButton = _ref => {
-  let {
-    Icon,
-    icon,
-    toggled = false,
-    onPress = () => {},
-    defaultValue,
-    disabled = false,
-    color = "primary",
-    colorSecondary = "surface",
-    borderColor = "divider",
-    iconSize = 25,
-    width = 50,
-    height = 50,
-    theme: {
-      colors
-    },
-    style,
-    ...rest
-  } = _ref;
-  const [internalValue, setInternalValue] = React.useState(toggled || defaultValue || false);
-  React.useEffect(() => {
-    if (toggled != null) {
-      setInternalValue(toggled);
-    }
-  }, [toggled]);
-  React.useEffect(() => {
-    if (defaultValue != null) {
-      setInternalValue(defaultValue);
-    }
-  }, [defaultValue]);
-
-  const handlePress = () => {
-    setInternalValue(!internalValue);
-    onPress(!internalValue);
-  };
-
-  return /*#__PURE__*/React.createElement(IconButton, _extends({
-    Icon: Icon,
-    icon: icon,
-    size: iconSize,
-    color: internalValue ? colors[color] : colors[colorSecondary],
-    onPress: handlePress,
-    disabled: disabled,
-    style: [styles.mainContainer, {
-      width,
-      height,
-      backgroundColor: internalValue ? colors[colorSecondary] : colors[color],
-      borderColor: colors[borderColor]
-    }, style]
-  }, rest));
-};
-
-const styles = StyleSheet.create({
-  mainContainer: {
-    borderWidth: 1
-  }
-});
-export default withTheme(ToggleButton);
-//# sourceMappingURL=ToggleButton.js.map

package/lib/module/components/ToggleButton.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["ToggleButton.tsx"],"names":["React","withTheme","StyleSheet","IconButton","ToggleButton","Icon","icon","toggled","onPress","defaultValue","disabled","color","colorSecondary","borderColor","iconSize","width","height","theme","colors","style","rest","internalValue","setInternalValue","useState","useEffect","handlePress","styles","mainContainer","backgroundColor","create","borderWidth"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,SAAT,QAA0B,YAA1B;AAEA,SAAoBC,UAApB,QAAiD,cAAjD;AACA,OAAOC,UAAP,MAAuB,cAAvB;;AAoBA,MAAMC,YAA6B,GAAG,QAgBhC;AAAA,MAhBiC;AACrCC,IAAAA,IADqC;AAErCC,IAAAA,IAFqC;AAGrCC,IAAAA,OAAO,GAAG,KAH2B;AAIrCC,IAAAA,OAAO,GAAG,MAAM,CAAE,CAJmB;AAKrCC,IAAAA,YALqC;AAMrCC,IAAAA,QAAQ,GAAG,KAN0B;AAOrCC,IAAAA,KAAK,GAAG,SAP6B;AAQrCC,IAAAA,cAAc,GAAG,SARoB;AASrCC,IAAAA,WAAW,GAAG,SATuB;AAUrCC,IAAAA,QAAQ,GAAG,EAV0B;AAWrCC,IAAAA,KAAK,GAAG,EAX6B;AAYrCC,IAAAA,MAAM,GAAG,EAZ4B;AAarCC,IAAAA,KAAK,EAAE;AAAEC,MAAAA;AAAF,KAb8B;AAcrCC,IAAAA,KAdqC;AAerC,OAAGC;AAfkC,GAgBjC;AACJ,QAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoCtB,KAAK,CAACuB,QAAN,CACxChB,OAAO,IAAIE,YAAX,IAA2B,KADa,CAA1C;AAIAT,EAAAA,KAAK,CAACwB,SAAN,CAAgB,MAAM;AACpB,QAAIjB,OAAO,IAAI,IAAf,EAAqB;AACnBe,MAAAA,gBAAgB,CAACf,OAAD,CAAhB;AACD;AACF,GAJD,EAIG,CAACA,OAAD,CAJH;AAMAP,EAAAA,KAAK,CAACwB,SAAN,CAAgB,MAAM;AACpB,QAAIf,YAAY,IAAI,IAApB,EAA0B;AACxBa,MAAAA,gBAAgB,CAACb,YAAD,CAAhB;AACD;AACF,GAJD,EAIG,CAACA,YAAD,CAJH;;AAMA,QAAMgB,WAAW,GAAG,MAAM;AACxBH,IAAAA,gBAAgB,CAAC,CAACD,aAAF,CAAhB;AACAb,IAAAA,OAAO,CAAC,CAACa,aAAF,CAAP;AACD,GAHD;;AAKA,sBACE,oBAAC,UAAD;AACE,IAAA,IAAI,EAAEhB,IADR;AAEE,IAAA,IAAI,EAAEC,IAFR;AAGE,IAAA,IAAI,EAAEQ,QAHR;AAIE,IAAA,KAAK,EAAEO,aAAa,GAAGH,MAAM,CAACP,KAAD,CAAT,GAAmBO,MAAM,CAACN,cAAD,CAJ/C;AAKE,IAAA,OAAO,EAAEa,WALX;AAME,IAAA,QAAQ,EAAEf,QANZ;AAOE,IAAA,KAAK,EAAE,CACLgB,MAAM,CAACC,aADF,EAEL;AACEZ,MAAAA,KADF;AAEEC,MAAAA,MAFF;AAGEY,MAAAA,eAAe,EAAEP,aAAa,GAC1BH,MAAM,CAACN,cAAD,CADoB,GAE1BM,MAAM,CAACP,KAAD,CALZ;AAMEE,MAAAA,WAAW,EAAEK,MAAM,CAACL,WAAD;AANrB,KAFK,EAULM,KAVK;AAPT,KAmBMC,IAnBN,EADF;AAuBD,CA7DD;;AA+DA,MAAMM,MAAM,GAAGxB,UAAU,CAAC2B,MAAX,CAAkB;AAC/BF,EAAAA,aAAa,EAAE;AACbG,IAAAA,WAAW,EAAE;AADA;AADgB,CAAlB,CAAf;AAMA,eAAe7B,SAAS,CAACG,YAAD,CAAxB","sourcesContent":["import * as React from \"react\";\nimport { withTheme } from \"../theming\";\nimport { colorTypes } from \"@draftbit/types\";\nimport { StyleProp, StyleSheet, ViewStyle } from \"react-native\";\nimport IconButton from \"./IconButton\";\nimport type { Theme } from \"../styles/DefaultTheme\";\nimport type { IconSlot } from \"../interfaces/Icon\";\n\ntype Props = {\n  icon: string;\n  toggled?: boolean;\n  onPress?: (value: boolean) => void;\n  defaultValue?: boolean;\n  disabled?: boolean;\n  color?: colorTypes;\n  colorSecondary?: colorTypes;\n  borderColor?: colorTypes;\n  iconSize?: number;\n  width?: number;\n  height?: number;\n  style?: StyleProp<ViewStyle>;\n  theme: Theme;\n} & IconSlot;\n\nconst ToggleButton: React.FC<Props> = ({\n  Icon,\n  icon,\n  toggled = false,\n  onPress = () => {},\n  defaultValue,\n  disabled = false,\n  color = \"primary\",\n  colorSecondary = \"surface\",\n  borderColor = \"divider\",\n  iconSize = 25,\n  width = 50,\n  height = 50,\n  theme: { colors },\n  style,\n  ...rest\n}) => {\n  const [internalValue, setInternalValue] = React.useState<boolean>(\n    toggled || defaultValue || false\n  );\n\n  React.useEffect(() => {\n    if (toggled != null) {\n      setInternalValue(toggled);\n    }\n  }, [toggled]);\n\n  React.useEffect(() => {\n    if (defaultValue != null) {\n      setInternalValue(defaultValue);\n    }\n  }, [defaultValue]);\n\n  const handlePress = () => {\n    setInternalValue(!internalValue);\n    onPress(!internalValue);\n  };\n\n  return (\n    <IconButton\n      Icon={Icon}\n      icon={icon}\n      size={iconSize}\n      color={internalValue ? colors[color] : colors[colorSecondary]}\n      onPress={handlePress}\n      disabled={disabled}\n      style={[\n        styles.mainContainer,\n        {\n          width,\n          height,\n          backgroundColor: internalValue\n            ? colors[colorSecondary]\n            : colors[color],\n          borderColor: colors[borderColor],\n        },\n        style,\n      ]}\n      {...rest}\n    />\n  );\n};\n\nconst styles = StyleSheet.create({\n  mainContainer: {\n    borderWidth: 1,\n  },\n});\n\nexport default withTheme(ToggleButton);\n"]}

package/lib/module/mappings/ToggleButton.js

@@ -1,51 +0,0 @@
-import { GROUPS, COMPONENT_TYPES, createIconProp, createBoolProp, createColorProp, createStaticNumberProp, createFieldNameProp, createIconSizeProp, createActionProp, Triggers } from "@draftbit/types";
-export const SEED_DATA = {
-  name: "Toggle Button",
-  tag: "ToggleButton",
-  category: COMPONENT_TYPES.button,
-  layout: {},
-  triggers: [Triggers.OnPress],
-  props: {
-    onPress: createActionProp(),
-    icon: createIconProp({
-      required: true
-    }),
-    iconSize: createIconSizeProp(),
-    fieldName: createFieldNameProp({
-      defaultValue: false,
-      valuePropName: "toggled"
-    }),
-    disabled: createBoolProp({
-      label: "Disabled",
-      description: "Whether the button should be disabled",
-      group: GROUPS.basic
-    }),
-    color: createColorProp({
-      group: GROUPS.basic
-    }),
-    colorSecondary: createColorProp({
-      label: "Secondary Color",
-      group: GROUPS.basic
-    }),
-    borderColor: createColorProp({
-      label: "Border Color",
-      group: GROUPS.basic
-    }),
-    width: createStaticNumberProp({
-      label: "Width",
-      description: "Width",
-      defaultValue: 50
-    }),
-    height: createStaticNumberProp({
-      label: "Height",
-      description: "Height",
-      defaultValue: 50
-    }),
-    toggled: createBoolProp({
-      label: "Toggled",
-      description: "Whether the button should show the toggled state",
-      defaultValue: false
-    })
-  }
-};
-//# sourceMappingURL=ToggleButton.js.map

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

@@ -1 +0,0 @@
-{"version":3,"sources":["ToggleButton.ts"],"names":["GROUPS","COMPONENT_TYPES","createIconProp","createBoolProp","createColorProp","createStaticNumberProp","createFieldNameProp","createIconSizeProp","createActionProp","Triggers","SEED_DATA","name","tag","category","button","layout","triggers","OnPress","props","onPress","icon","required","iconSize","fieldName","defaultValue","valuePropName","disabled","label","description","group","basic","color","colorSecondary","borderColor","width","height","toggled"],"mappings":"AAAA,SACEA,MADF,EAEEC,eAFF,EAGEC,cAHF,EAIEC,cAJF,EAKEC,eALF,EAMEC,sBANF,EAOEC,mBAPF,EAQEC,kBARF,EASEC,gBATF,EAUEC,QAVF,QAWO,iBAXP;AAaA,OAAO,MAAMC,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,eADiB;AAEvBC,EAAAA,GAAG,EAAE,cAFkB;AAGvBC,EAAAA,QAAQ,EAAEZ,eAAe,CAACa,MAHH;AAIvBC,EAAAA,MAAM,EAAE,EAJe;AAKvBC,EAAAA,QAAQ,EAAE,CAACP,QAAQ,CAACQ,OAAV,CALa;AAMvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAEX,gBAAgB,EADpB;AAELY,IAAAA,IAAI,EAAElB,cAAc,CAAC;AACnBmB,MAAAA,QAAQ,EAAE;AADS,KAAD,CAFf;AAKLC,IAAAA,QAAQ,EAAEf,kBAAkB,EALvB;AAMLgB,IAAAA,SAAS,EAAEjB,mBAAmB,CAAC;AAC7BkB,MAAAA,YAAY,EAAE,KADe;AAE7BC,MAAAA,aAAa,EAAE;AAFc,KAAD,CANzB;AAULC,IAAAA,QAAQ,EAAEvB,cAAc,CAAC;AACvBwB,MAAAA,KAAK,EAAE,UADgB;AAEvBC,MAAAA,WAAW,EAAE,uCAFU;AAGvBC,MAAAA,KAAK,EAAE7B,MAAM,CAAC8B;AAHS,KAAD,CAVnB;AAeLC,IAAAA,KAAK,EAAE3B,eAAe,CAAC;AACrByB,MAAAA,KAAK,EAAE7B,MAAM,CAAC8B;AADO,KAAD,CAfjB;AAkBLE,IAAAA,cAAc,EAAE5B,eAAe,CAAC;AAC9BuB,MAAAA,KAAK,EAAE,iBADuB;AAE9BE,MAAAA,KAAK,EAAE7B,MAAM,CAAC8B;AAFgB,KAAD,CAlB1B;AAsBLG,IAAAA,WAAW,EAAE7B,eAAe,CAAC;AAC3BuB,MAAAA,KAAK,EAAE,cADoB;AAE3BE,MAAAA,KAAK,EAAE7B,MAAM,CAAC8B;AAFa,KAAD,CAtBvB;AA0BLI,IAAAA,KAAK,EAAE7B,sBAAsB,CAAC;AAC5BsB,MAAAA,KAAK,EAAE,OADqB;AAE5BC,MAAAA,WAAW,EAAE,OAFe;AAG5BJ,MAAAA,YAAY,EAAE;AAHc,KAAD,CA1BxB;AA+BLW,IAAAA,MAAM,EAAE9B,sBAAsB,CAAC;AAC7BsB,MAAAA,KAAK,EAAE,QADsB;AAE7BC,MAAAA,WAAW,EAAE,QAFgB;AAG7BJ,MAAAA,YAAY,EAAE;AAHe,KAAD,CA/BzB;AAoCLY,IAAAA,OAAO,EAAEjC,cAAc,CAAC;AACtBwB,MAAAA,KAAK,EAAE,SADe;AAEtBC,MAAAA,WAAW,EAAE,kDAFS;AAGtBJ,MAAAA,YAAY,EAAE;AAHQ,KAAD;AApClB;AANgB,CAAlB","sourcesContent":["import {\n  GROUPS,\n  COMPONENT_TYPES,\n  createIconProp,\n  createBoolProp,\n  createColorProp,\n  createStaticNumberProp,\n  createFieldNameProp,\n  createIconSizeProp,\n  createActionProp,\n  Triggers,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n  name: \"Toggle Button\",\n  tag: \"ToggleButton\",\n  category: COMPONENT_TYPES.button,\n  layout: {},\n  triggers: [Triggers.OnPress],\n  props: {\n    onPress: createActionProp(),\n    icon: createIconProp({\n      required: true,\n    }),\n    iconSize: createIconSizeProp(),\n    fieldName: createFieldNameProp({\n      defaultValue: false,\n      valuePropName: \"toggled\",\n    }),\n    disabled: createBoolProp({\n      label: \"Disabled\",\n      description: \"Whether the button should be disabled\",\n      group: GROUPS.basic,\n    }),\n    color: createColorProp({\n      group: GROUPS.basic,\n    }),\n    colorSecondary: createColorProp({\n      label: \"Secondary Color\",\n      group: GROUPS.basic,\n    }),\n    borderColor: createColorProp({\n      label: \"Border Color\",\n      group: GROUPS.basic,\n    }),\n    width: createStaticNumberProp({\n      label: \"Width\",\n      description: \"Width\",\n      defaultValue: 50,\n    }),\n    height: createStaticNumberProp({\n      label: \"Height\",\n      description: \"Height\",\n      defaultValue: 50,\n    }),\n    toggled: createBoolProp({\n      label: \"Toggled\",\n      description: \"Whether the button should show the toggled state\",\n      defaultValue: false,\n    }),\n  },\n};\n"]}

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

@@ -1,24 +0,0 @@
-import * as React from "react";
-import { colorTypes } from "@draftbit/types";
-import { StyleProp, ViewStyle } from "react-native";
-import type { Theme } from "../styles/DefaultTheme";
-import type { IconSlot } from "../interfaces/Icon";
-declare type Props = {
-    icon: string;
-    toggled?: boolean;
-    onPress?: (value: boolean) => void;
-    defaultValue?: boolean;
-    disabled?: boolean;
-    color?: colorTypes;
-    colorSecondary?: colorTypes;
-    borderColor?: colorTypes;
-    iconSize?: number;
-    width?: number;
-    height?: number;
-    style?: StyleProp<ViewStyle>;
-    theme: Theme;
-} & IconSlot;
-declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<Props, "theme"> & {
-    theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
-}> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<Props> & React.FC<Props>, {}>;
-export default _default;

package/lib/typescript/src/mappings/ToggleButton.d.ts

@@ -1,124 +0,0 @@
-export declare const SEED_DATA: {
-    name: string;
-    tag: string;
-    category: string;
-    layout: {};
-    triggers: string[];
-    props: {
-        onPress: {
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            formType: string;
-            propType: string;
-            defaultValue: null;
-            group: string;
-        };
-        icon: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            defaultValue: string;
-            required: boolean;
-            editable: boolean;
-            group: string;
-        };
-        iconSize: {
-            group: string;
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            formType: string;
-            propType: string;
-            defaultValue: number;
-            options: number[];
-        };
-        fieldName: {
-            handlerPropName: string;
-            group: string;
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            defaultValue: string;
-            valuePropName: string;
-            editable: boolean;
-            required: boolean;
-        };
-        disabled: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            defaultValue: boolean;
-            editable: boolean;
-            required: boolean;
-            group: string;
-        };
-        color: {
-            group: string;
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            defaultValue: null;
-            formType: string;
-            propType: string;
-        };
-        colorSecondary: {
-            group: string;
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            defaultValue: null;
-            formType: string;
-            propType: string;
-        };
-        borderColor: {
-            group: string;
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            defaultValue: null;
-            formType: string;
-            propType: string;
-        };
-        width: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-        height: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-        toggled: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            defaultValue: boolean;
-            editable: boolean;
-            required: boolean;
-            group: string;
-        };
-    };
-};

package/src/components/ToggleButton.js

@@ -1,39 +0,0 @@
-import * as React from "react";
-import { withTheme } from "../theming";
-import { StyleSheet } from "react-native";
-import IconButton from "./IconButton";
-const ToggleButton = ({ Icon, icon, toggled = false, onPress = () => { }, defaultValue, disabled = false, color = "primary", colorSecondary = "surface", borderColor = "divider", iconSize = 25, width = 50, height = 50, theme: { colors }, style, ...rest }) => {
-    const [internalValue, setInternalValue] = React.useState(toggled || defaultValue || false);
-    React.useEffect(() => {
-        if (toggled != null) {
-            setInternalValue(toggled);
-        }
-    }, [toggled]);
-    React.useEffect(() => {
-        if (defaultValue != null) {
-            setInternalValue(defaultValue);
-        }
-    }, [defaultValue]);
-    const handlePress = () => {
-        setInternalValue(!internalValue);
-        onPress(!internalValue);
-    };
-    return (React.createElement(IconButton, { Icon: Icon, icon: icon, size: iconSize, color: internalValue ? colors[color] : colors[colorSecondary], onPress: handlePress, disabled: disabled, style: [
-            styles.mainContainer,
-            {
-                width,
-                height,
-                backgroundColor: internalValue
-                    ? colors[colorSecondary]
-                    : colors[color],
-                borderColor: colors[borderColor],
-            },
-            style,
-        ], ...rest }));
-};
-const styles = StyleSheet.create({
-    mainContainer: {
-        borderWidth: 1,
-    },
-});
-export default withTheme(ToggleButton);

package/src/components/ToggleButton.tsx

@@ -1,94 +0,0 @@
-import * as React from "react";
-import { withTheme } from "../theming";
-import { colorTypes } from "@draftbit/types";
-import { StyleProp, StyleSheet, ViewStyle } from "react-native";
-import IconButton from "./IconButton";
-import type { Theme } from "../styles/DefaultTheme";
-import type { IconSlot } from "../interfaces/Icon";
-
-type Props = {
-  icon: string;
-  toggled?: boolean;
-  onPress?: (value: boolean) => void;
-  defaultValue?: boolean;
-  disabled?: boolean;
-  color?: colorTypes;
-  colorSecondary?: colorTypes;
-  borderColor?: colorTypes;
-  iconSize?: number;
-  width?: number;
-  height?: number;
-  style?: StyleProp<ViewStyle>;
-  theme: Theme;
-} & IconSlot;
-
-const ToggleButton: React.FC<Props> = ({
-  Icon,
-  icon,
-  toggled = false,
-  onPress = () => {},
-  defaultValue,
-  disabled = false,
-  color = "primary",
-  colorSecondary = "surface",
-  borderColor = "divider",
-  iconSize = 25,
-  width = 50,
-  height = 50,
-  theme: { colors },
-  style,
-  ...rest
-}) => {
-  const [internalValue, setInternalValue] = React.useState<boolean>(
-    toggled || defaultValue || false
-  );
-
-  React.useEffect(() => {
-    if (toggled != null) {
-      setInternalValue(toggled);
-    }
-  }, [toggled]);
-
-  React.useEffect(() => {
-    if (defaultValue != null) {
-      setInternalValue(defaultValue);
-    }
-  }, [defaultValue]);
-
-  const handlePress = () => {
-    setInternalValue(!internalValue);
-    onPress(!internalValue);
-  };
-
-  return (
-    <IconButton
-      Icon={Icon}
-      icon={icon}
-      size={iconSize}
-      color={internalValue ? colors[color] : colors[colorSecondary]}
-      onPress={handlePress}
-      disabled={disabled}
-      style={[
-        styles.mainContainer,
-        {
-          width,
-          height,
-          backgroundColor: internalValue
-            ? colors[colorSecondary]
-            : colors[color],
-          borderColor: colors[borderColor],
-        },
-        style,
-      ]}
-      {...rest}
-    />
-  );
-};
-
-const styles = StyleSheet.create({
-  mainContainer: {
-    borderWidth: 1,
-  },
-});
-
-export default withTheme(ToggleButton);

package/src/mappings/ToggleButton.js

@@ -1,50 +0,0 @@
-import { GROUPS, COMPONENT_TYPES, createIconProp, createBoolProp, createColorProp, createStaticNumberProp, createFieldNameProp, createIconSizeProp, createActionProp, Triggers, } from "@draftbit/types";
-export const SEED_DATA = {
-    name: "Toggle Button",
-    tag: "ToggleButton",
-    category: COMPONENT_TYPES.button,
-    layout: {},
-    triggers: [Triggers.OnPress],
-    props: {
-        onPress: createActionProp(),
-        icon: createIconProp({
-            required: true,
-        }),
-        iconSize: createIconSizeProp(),
-        fieldName: createFieldNameProp({
-            defaultValue: false,
-            valuePropName: "toggled",
-        }),
-        disabled: createBoolProp({
-            label: "Disabled",
-            description: "Whether the button should be disabled",
-            group: GROUPS.basic,
-        }),
-        color: createColorProp({
-            group: GROUPS.basic,
-        }),
-        colorSecondary: createColorProp({
-            label: "Secondary Color",
-            group: GROUPS.basic,
-        }),
-        borderColor: createColorProp({
-            label: "Border Color",
-            group: GROUPS.basic,
-        }),
-        width: createStaticNumberProp({
-            label: "Width",
-            description: "Width",
-            defaultValue: 50,
-        }),
-        height: createStaticNumberProp({
-            label: "Height",
-            description: "Height",
-            defaultValue: 50,
-        }),
-        toggled: createBoolProp({
-            label: "Toggled",
-            description: "Whether the button should show the toggled state",
-            defaultValue: false,
-        }),
-    },
-};