@draftbit/core 47.0.1-d41acb.2 → 47.0.1-e04fa3.2

package/lib/commonjs/mappings/NativeBase/Popover.js

@@ -0,0 +1,99 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SHARED_SEED_DATA = {
+  category: _types.COMPONENT_TYPES.NBPopover,
+  packageName: "native-base",
+  stylesPanelSections: [_types.StylesPanelSections.LayoutFlexItems, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.LayoutContent, _types.StylesPanelSections.Background, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Effects],
+  layout: {},
+  triggers: {}
+};
+const SEED_DATA = [{
+  name: "Popover",
+  tag: "Popover",
+  description: "Popover floats around a trigger. It is a non-modal dialog used to provide contextual information to the user. It should be paired with a pressable trigger element.",
+  ...SHARED_SEED_DATA,
+  allowChildren: true,
+  props: {
+    isOpen: (0, _types.createBoolProp)({
+      label: "Is Open",
+      description: "If true, the popover is open. Useful for controlling the open state."
+    }),
+    defaultIsOpen: (0, _types.createStaticBoolProp)({
+      label: "Default Is Open",
+      description: "If true, the popover will be opened by default."
+    }),
+    trapFocus: (0, _types.createStaticBoolProp)({
+      label: "Trap Focus",
+      description: "Whether popover should trap focus."
+    }),
+    shouldFlip: (0, _types.createStaticBoolProp)({
+      label: "Should Flip",
+      description: "Whether popover should flip when it reaches the edge of the screen.",
+      defaultValue: true
+    }),
+    shouldOverlapWithTrigger: (0, _types.createStaticBoolProp)({
+      label: "Should Overlap With Trigger",
+      description: "Whether popover should overlap with trigger.",
+      defaultValue: false
+    }),
+    isKeyboardDismissable: (0, _types.createStaticBoolProp)({
+      label: "Is Keyboard Dismissable",
+      description: "If true, the popover will close when the keyboard is dismissed.",
+      defaultValue: true
+    }),
+    placement: (0, _types.createTextEnumProp)({
+      label: "Placement",
+      description: "The placement of the popover",
+      options: ["bottom", "top", "left", "right", "top left", "top right", "bottom left", "bottom right", "right bottom", "right top", "left bottom", "left top"],
+      defaultValue: "bottom left"
+    }),
+    useRNModal: (0, _types.createStaticBoolProp)({
+      label: "Use RN Modal",
+      description: "If true, the popover will use the RN Modal component."
+    }),
+    onOpen: (0, _types.createActionProp)(),
+    onClose: (0, _types.createActionProp)()
+  }
+}, {
+  name: "Popover Arrow",
+  tag: "Popover.Arrow",
+  description: "The popover arrow.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Popover Body",
+  tag: "Popover.Body",
+  description: "The body of the popover.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Popover Content",
+  tag: "Popover.Content",
+  description: "The popover itself.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Popover Close Button",
+  tag: "Popover.CloseButton",
+  description: "The button that closes the popover.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Popover Header",
+  tag: "Popover.Header",
+  description: "The header of the popover.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Popover Trigger",
+  tag: "Popover.Trigger",
+  description: "Used to wrap the reference (or trigger) element.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}];
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/mappings/NativeBase/Select.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SHARED_SEED_DATA = {
+  category: _types.COMPONENT_TYPES.NBForms,
+  packageName: "native-base",
+  doc_link: "https://docs.nativebase.io/select",
+  code_link: "https://github.com/GeekyAnts/NativeBase/tree/master/src/components/primitives/Select",
+  stylesPanelSections: [_types.StylesPanelSections.LayoutFlexItems, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.LayoutContent, _types.StylesPanelSections.Background, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Effects],
+  layout: {},
+  allowChildren: true
+};
+const SEED_DATA = [{
+  name: "Select",
+  tag: "Select",
+  description: "Select creates a dropdown list of items with the selected item in closed view.",
+  ...SHARED_SEED_DATA,
+  triggers: [_types.Triggers.OnOpen, _types.Triggers.OnClose],
+  props: {
+    onOpen: (0, _types.createActionProp)(),
+    onClose: (0, _types.createActionProp)(),
+    placeholder: (0, _types.createTextProp)({
+      label: "Placeholder",
+      defaultValue: "Select an option"
+    }),
+    color: (0, _types.createColorProp)(),
+    placeholderTextColor: (0, _types.createColorProp)(),
+    isDisabled: (0, _types.createDisabledProp)(),
+    isHovered: (0, _types.createBoolProp)({
+      label: "Hovered?",
+      description: "Whether the select is hovered"
+    }),
+    isFocused: (0, _types.createBoolProp)({
+      label: "Focused?",
+      description: "Whether the select is hovered"
+    }),
+    isFocusVisible: (0, _types.createBoolProp)({
+      label: "Focus Visible?",
+      description: "WIf true, the focus ring of select will be visible."
+    }),
+    dropdownIcon: (0, _types.createIconProp)(),
+    dropdownOpenIcon: (0, _types.createIconProp)(),
+    dropdownCloseIcon: (0, _types.createIconProp)()
+  }
+}, {
+  name: "Select Item",
+  tag: "Select.Item",
+  description: "An individual item in the menu.",
+  ...SHARED_SEED_DATA,
+  props: {
+    label: (0, _types.createTextProp)({
+      label: "Label",
+      description: "The label of the item"
+    }),
+    value: (0, _types.createTextProp)({
+      label: "Value",
+      description: "The value of the item"
+    })
+  }
+}];
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/mappings/NativeBase/Slider.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SEED_DATA = void 0;
+var _types = require("@draftbit/types");
+const SHARED_SEED_DATA = {
+  category: _types.COMPONENT_TYPES.NBForms,
+  packageName: "native-base",
+  stylesPanelSections: [_types.StylesPanelSections.LayoutFlexItems, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.LayoutContent, _types.StylesPanelSections.Background, _types.StylesPanelSections.Size, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Position, _types.StylesPanelSections.Borders, _types.StylesPanelSections.Effects],
+  layout: {},
+  allowChildren: true
+};
+const SEED_DATA = [{
+  name: "Slider",
+  tag: "Slider",
+  description: "The Slider allows users to select options from a given range of values.",
+  ...SHARED_SEED_DATA,
+  triggers: [_types.Triggers.OnChange, _types.Triggers.OnChangeEnd],
+  props: {
+    onChange: (0, _types.createActionProp)(),
+    onChangeEnd: (0, _types.createActionProp)(),
+    defaultValue: (0, _types.createNumberProp)(),
+    thumbSize: (0, _types.createStaticNumberProp)({
+      label: "Thumb Size",
+      description: "The size of the slider thumb"
+    }),
+    sliderTrackHeight: (0, _types.createStaticNumberProp)({
+      label: "Slider Track Height",
+      description: "The height of the slider track"
+    }),
+    minValue: (0, _types.createStaticNumberProp)({
+      label: "Min Value"
+    }),
+    maxValue: (0, _types.createStaticNumberProp)({
+      label: "Max Value"
+    }),
+    step: (0, _types.createStaticNumberProp)({
+      label: "Step"
+    }),
+    isReadOnly: (0, _types.createBoolProp)({
+      label: "Read Only",
+      description: "Whether the slider is read only",
+      defaultValue: false
+    }),
+    isReversed: (0, _types.createStaticBoolProp)({
+      label: "Reversed",
+      description: "If true, the value will be incremented or decremented in reverse.",
+      defaultValue: false
+    }),
+    orientation: (0, _types.createTextEnumProp)({
+      label: "Orientation",
+      description: "The orientation of the Slider.",
+      options: ["horizontal", "vertical"],
+      defaultValue: "horizontal"
+    }),
+    isDisabled: (0, _types.createDisabledProp)(),
+    accessibilityLabel: (0, _types.createAccessibilityLabelProp)()
+  }
+}, {
+  name: "Slider Track",
+  tag: "Menu.Item",
+  description: "An individual item in the menu.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Slider Filled Track",
+  tag: "Menu.Group",
+  description: "A wrapper to group related menu items.",
+  ...SHARED_SEED_DATA,
+  props: {}
+}, {
+  name: "Slider Thumb",
+  tag: "Menu.OptionGroup",
+  description: "A wrapper for checkable menu items (radio and checkbox).",
+  ...SHARED_SEED_DATA,
+  triggers: [_types.Triggers.OnChange],
+  props: {}
+}];
+exports.SEED_DATA = SEED_DATA;

package/lib/commonjs/mappings/Touchable.js

@@ -5,56 +5,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SEED_DATA = void 0;
 var _types = require("@draftbit/types");
-const SEED_DATA_PROPS = {
+const SEED_DATA = {
+  name: "Touchable",
+  tag: "Touchable",
+  description: "Simple button with no styles",
+  category: _types.COMPONENT_TYPES.button,
   stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Borders],
   layout: {},
-  triggers: [_types.Triggers.OnPress, _types.Triggers.OnLongPress],
+  triggers: [_types.Triggers.OnPress],
   props: {
-    onPress: (0, _types.createActionProp)(),
-    onLongPress: (0, _types.createActionProp)(),
-    activeOpacity: (0, _types.createStaticNumberProp)({
-      label: "Active Opacity",
-      description: "The opacity when the button is pressed.",
-      defaultValue: 0.8,
-      min: 0,
-      max: 1,
-      step: 0.01,
-      precision: 2,
-      required: false
-    }),
-    disabledOpacity: (0, _types.createStaticNumberProp)({
-      label: "Disabled Opacity",
-      description: "The opacity when the button is disabled.",
-      defaultValue: 0.8,
-      min: 0,
-      max: 1,
-      step: 0.01,
-      precision: 2,
-      required: false
-    }),
-    delayLongPress: (0, _types.createStaticNumberProp)({
-      label: "Delay Long Press",
-      description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
-      required: false
-    }),
-    hitSlop: (0, _types.createStaticNumberProp)({
-      label: "Hit Slop",
-      description: "Sets additional distance outside of element in which a press can be detected.",
-      required: false
-    })
+    onPress: (0, _types.createActionProp)()
   }
 };
-const SEED_DATA = [{
-  name: "Touchable",
-  tag: "Touchable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.deprecated,
-  ...SEED_DATA_PROPS
-}, {
-  name: "Pressable",
-  tag: "Pressable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.button,
-  ...SEED_DATA_PROPS
-}];
 exports.SEED_DATA = SEED_DATA;

package/lib/module/components/Button.js

@@ -13,11 +13,10 @@ function Base(_ref) {
     Icon,
     icon,
     title,
+    onPress,
     loading,
     disabled,
     style,
-    activeOpacity,
-    disabledOpacity,
     ...props
   } = _ref;
   const {
@@ -54,13 +53,14 @@ function Base(_ref) {
     buttonStyles.justifyContent = "flex-end";
   }
   return /*#__PURE__*/React.createElement(Pressable, _extends({
+    onPress: onPress,
     disabled: disabled || loading,
     style: _ref2 => {
       let {
         pressed
       } = _ref2;
       return [styles.base, {
-        opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
+        opacity: pressed || disabled ? 0.75 : 1
       }, buttonStyles];
     }
   }, props), loading ? /*#__PURE__*/React.createElement(ActivityIndicator, {

package/lib/module/components/Checkbox/Checkbox.js

@@ -1,7 +1,8 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { View, StyleSheet, Pressable } from "react-native";
+import { View, StyleSheet } from "react-native";
 import { useTheme } from "../../theming";
+import Touchable from "../Touchable";
 import { usePrevious } from "../../hooks";
 const Checkbox = _ref => {
   let {
@@ -50,7 +51,7 @@ const Checkbox = _ref => {
       onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
     }
   };
-  return /*#__PURE__*/React.createElement(Pressable, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
     onPress: handlePress,
     disabled: disabled,
     accessibilityState: {

package/lib/module/components/Checkbox/CheckboxGroupRow.js

@@ -1,10 +1,11 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { StyleSheet, View, Platform, Pressable } from "react-native";
+import { StyleSheet, View, Platform } from "react-native";
 import Checkbox from "./Checkbox";
 import Text from "../Text";
 import { useCheckboxGroupContext } from "./context";
 import { Direction as GroupDirection } from "./context";
+import Touchable from "../Touchable";
 import { extractStyles } from "../../utilities";
 export let Direction;
 (function (Direction) {
@@ -63,7 +64,7 @@ const CheckboxGroupRow = _ref => {
     textStyles,
     viewStyles
   } = extractStyles(style);
-  return /*#__PURE__*/React.createElement(Pressable, _extends({
+  return /*#__PURE__*/React.createElement(Touchable, _extends({
     onPress: handlePress,
     style: [styles.mainParent, {
       flexDirection: direction

package/lib/module/components/Checkbox/CheckboxRow.js

@@ -1,10 +1,11 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { StyleSheet, View, Platform, Pressable } from "react-native";
+import { StyleSheet, View, Platform } from "react-native";
 import { isString } from "lodash";
 import { extractStyles } from "../../utilities";
 import { usePrevious } from "../../hooks";
 import Text from "../Text";
+import Touchable from "../Touchable";
 import Checkbox from "./Checkbox";
 export let Direction;
 (function (Direction) {
@@ -72,7 +73,7 @@ const CheckboxRow = _ref => {
     textStyles,
     viewStyles
   } = extractStyles(style);
-  return /*#__PURE__*/React.createElement(Pressable, _extends({
+  return /*#__PURE__*/React.createElement(Touchable, _extends({
     onPress: handlePress,
     style: [viewStyles, styles.mainParent, {
       flexDirection: direction

package/lib/module/components/DeprecatedButton.js

@@ -1,8 +1,9 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { ActivityIndicator, View, Text, StyleSheet, Pressable } from "react-native";
+import { ActivityIndicator, View, Text, StyleSheet } from "react-native";
 import color from "color";
 import Config from "./Config";
+import Touchable from "./Touchable";
 import Elevation from "./Elevation";
 import { withTheme } from "../theming";
 const Button = _ref => {
@@ -17,6 +18,7 @@ const Button = _ref => {
     children,
     onPress,
     elevation = 0,
+    style,
     theme: {
       colors,
       disabledOpacity,
@@ -70,19 +72,41 @@ const Button = _ref => {
     marginRight: -8,
     width: Config.buttonIconSize
   }];
+  const {
+    margin,
+    marginEnd,
+    marginTop,
+    marginLeft,
+    marginRight,
+    marginBottom,
+    marginHorizontal,
+    marginVertical,
+    ...innerStyles
+  } = StyleSheet.flatten(style || {});
+  const margins = {
+    margin,
+    marginEnd,
+    marginTop,
+    marginLeft,
+    marginRight,
+    marginBottom,
+    marginHorizontal,
+    marginVertical
+  };
   return /*#__PURE__*/React.createElement(Elevation, {
     style: {
       elevation,
-      alignSelf: "stretch"
+      alignSelf: "stretch",
+      ...margins
     }
-  }, /*#__PURE__*/React.createElement(Pressable, _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
     onPress: onPress,
     accessibilityState: {
       disabled
     },
     accessibilityRole: "button",
     disabled: disabled || loading,
-    style: [styles.button, buttonStyle]
+    style: [styles.button, buttonStyle, innerStyles]
   }), /*#__PURE__*/React.createElement(View, {
     style: styles.content
   }, icon && loading !== true ? /*#__PURE__*/React.createElement(View, {

package/lib/module/components/DeprecatedFAB.js

@@ -1,9 +1,10 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 { ActivityIndicator, View, StyleSheet, Pressable } from "react-native";
+import { ActivityIndicator, View, StyleSheet } from "react-native";
 import color from "color";
 import Config from "./Config";
 import Text from "./Text";
+import Touchable from "./Touchable";
 import Elevation from "./Elevation";
 import { withTheme } from "../theming";
 const FAB = _ref => {
@@ -97,7 +98,7 @@ const FAB = _ref => {
     style: [{
       elevation
     }, style]
-  }, /*#__PURE__*/React.createElement(Pressable, _extends({}, rest, {
+  }, /*#__PURE__*/React.createElement(Touchable, _extends({}, rest, {
     onPress: onPress,
     accessibilityState: {
       disabled

package/lib/module/components/Touchable.js

@@ -6,24 +6,19 @@ export default function Touchable(_ref) {
     children,
     disabled,
     onPress,
-    activeOpacity,
-    disabledOpacity,
-    delayLongPress,
-    hitSlop,
     style,
     ...props
   } = _ref;
   return /*#__PURE__*/React.createElement(Pressable, _extends({
-    disabled: disabled,
     onPress: onPress,
-    delayLongPress: delayLongPress ? delayLongPress : 500,
-    hitSlop: hitSlop ? hitSlop : 8,
+    disabled: disabled,
+    hitSlop: 8,
     style: _ref2 => {
       let {
         pressed
       } = _ref2;
       return [{
-        opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1
+        opacity: pressed || disabled ? 0.75 : 1
       }, style];
     }
   }, props), children);