@draftbit/core 46.4.4-808a01.2 → 46.4.4-86483e.2

package/lib/commonjs/components/TextField.js

@@ -4,29 +4,25 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _reactNative = require("react-native");
-
 var _theming = require("../theming");
-
 var _utilities = require("../utilities");
-
 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 ? 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); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 const AnimatedText = _reactNative.Animated.createAnimatedComponent(_reactNative.Text);
-
 const FOCUS_ANIMATION_DURATION = 150;
 const BLUR_ANIMATION_DURATION = 180;
 const ICON_SIZE = 24;
-
 class TextField extends React.Component {
   constructor() {
     super(...arguments);
-    this.state = {
+    _defineProperty(this, "state", {
+      nativeProps: {},
       labeled: new _reactNative.Animated.Value(this.props.value || this.props.error ? 0 : 1),
       focused: false,
       placeholder: this.props.error ? this.props.placeholder : "",
@@ -34,59 +30,50 @@ class TextField extends React.Component {
         measured: false,
         width: 0
       }
-    };
-    this._timer = setTimeout(() => {}, 0);
+    });
+    _defineProperty(this, "_timer", setTimeout(() => {}, 0));
+    _defineProperty(this, "_showPlaceholder", () => {
+      clearTimeout(this._timer);
 
-    this._showPlaceholder = () => {
-      clearTimeout(this._timer); // Set the placeholder in a delay to offset the label animation
+      // Set the placeholder in a delay to offset the label animation
       // If we show it immediately, they'll overlap and look ugly
-
       this._timer = setTimeout(() => this.setState({
         placeholder: this.props.placeholder
       }), 50);
-    };
-
-    this._hidePlaceholder = () => this.setState({
-      placeholder: ""
     });
-
-    this._restoreLabel = () => _reactNative.Animated.timing(this.state.labeled, {
+    _defineProperty(this, "_hidePlaceholder", () => this.setState({
+      placeholder: ""
+    }));
+    _defineProperty(this, "_restoreLabel", () => _reactNative.Animated.timing(this.state.labeled, {
       toValue: 1,
       duration: FOCUS_ANIMATION_DURATION,
       useNativeDriver: true
-    }).start();
-
-    this._minmizeLabel = () => _reactNative.Animated.timing(this.state.labeled, {
+    }).start());
+    _defineProperty(this, "_minmizeLabel", () => _reactNative.Animated.timing(this.state.labeled, {
       toValue: 0,
       duration: BLUR_ANIMATION_DURATION,
       useNativeDriver: true
-    }).start();
-
-    this._handleFocus = () => {
+    }).start());
+    _defineProperty(this, "_handleFocus", () => {
       if (this.props.disabled) {
         return;
       }
-
       this.setState({
         focused: true
       });
-    };
-
-    this._handleBlur = () => {
+    });
+    _defineProperty(this, "_handleBlur", () => {
       if (this.props.disabled) {
         return;
       }
-
       this.setState({
         focused: false
       });
-    };
-
-    this._handleChangeText = value => {
+    });
+    _defineProperty(this, "_handleChangeText", value => {
       if (this.props.disabled) {
         return;
       }
-
       if (typeof value === "string") {
         this.setState({
           value
@@ -98,27 +85,22 @@ class TextField extends React.Component {
         });
         this.props.onChangeText && this.props.onChangeText(value.nativeEvent.text);
       }
-    };
-
-    this._root = undefined;
+    });
+    _defineProperty(this, "_root", undefined);
   }
-
   static getDerivedStateFromProps(nextProps, prevState) {
     return {
       value: typeof nextProps.value !== "undefined" ? nextProps.value : prevState.value
     };
   }
-
   componentDidMount() {
     if (this.props.defaultValue) {
       this._handleChangeText(this.props.defaultValue);
     }
-
     if (this.props.placeholder) {
       this._minmizeLabel();
     }
   }
-
   componentDidUpdate(prevProps, prevState) {
     if (prevState.focused !== this.state.focused || prevState.value !== this.state.value) {
       // The label should be minimized if the text input is focused, or has text
@@ -129,7 +111,6 @@ class TextField extends React.Component {
         this._restoreLabel();
       }
     }
-
     if (prevState.focused !== this.state.focused || prevProps.label !== this.props.label) {
       // Show placeholder text only if the input is focused, or has error, or there's no label
       // We don't show placeholder if there's a label because the label acts as placeholder
@@ -141,11 +122,9 @@ class TextField extends React.Component {
       }
     }
   }
-
   componentWillUnmount() {
     clearTimeout(this._timer);
   }
-
   toggleFocus() {
     this.setState(prevState => ({
       focused: !prevState.focused
@@ -154,28 +133,24 @@ class TextField extends React.Component {
   /**
    * @internal
    */
-
-
   setNativeProps(args) {
-    return this._root && this._root.setNativeProps(args);
+    this.setState(state => ({
+      ...state,
+      nativeState: args || {}
+    }));
   }
-
   isFocused() {
     return this._root && this._root.isFocused();
   }
-
   clear() {
     return this._root && this._root.clear();
   }
-
   focus() {
     return this._root && this._root.focus();
   }
-
   blur() {
     return this._root && this._root.blur();
   }
-
   render() {
     const {
       Icon,
@@ -198,8 +173,7 @@ class TextField extends React.Component {
         roundness,
         disabledOpacity
       },
-      render = props => /*#__PURE__*/React.createElement(_reactNative.TextInput, { ...props
-      }),
+      render = props => /*#__PURE__*/React.createElement(_reactNative.TextInput, props),
       ...rest
     } = this.props;
     const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
@@ -209,7 +183,6 @@ class TextField extends React.Component {
     const hasActiveOutline = this.state.focused || error;
     let inputTextColor, activeColor, underlineColor, borderColor, placeholderColor, containerStyle, backgroundColor, inputStyle;
     inputTextColor = colors.strong;
-
     if (disabled) {
       activeColor = colors.light;
       placeholderColor = colors.light;
@@ -222,11 +195,9 @@ class TextField extends React.Component {
       underlineColor = underlineColorProp;
       backgroundColor = colors.background;
     }
-
     if (rest.placeholderTextColor) {
       placeholderColor = rest.placeholderTextColor;
     }
-
     const {
       lineHeight,
       ...subtitle1
@@ -238,13 +209,10 @@ class TextField extends React.Component {
       paddingRight: rightIconName ? ICON_SIZE + 16 + 4 : 12,
       ...subtitle1
     };
-
     if (!multiline) {
       inputStyle.height = lineHeight;
     }
-
     let assistiveTextLeftMargin;
-
     if (type === "underline") {
       containerStyle = {
         borderTopLeftRadius: roundness,
@@ -252,7 +220,6 @@ class TextField extends React.Component {
         paddingBottom: 12,
         marginTop: 16
       };
-
       if (leftIconName && leftIconMode === "outset") {
         assistiveTextLeftMargin = ICON_SIZE + 8;
       } else {
@@ -268,7 +235,6 @@ class TextField extends React.Component {
         opacity: disabled ? disabledOpacity : 1,
         backgroundColor
       };
-
       if (leftIconName && leftIconMode === "inset") {
         assistiveTextLeftMargin = 16 + 4;
       } else if (leftIconName && leftIconMode === "outset") {
@@ -276,16 +242,12 @@ class TextField extends React.Component {
       } else {
         assistiveTextLeftMargin = 12;
       }
-
       inputStyle.paddingHorizontal = 12;
     }
-
     if (leftIconName && leftIconMode === "outset") {
       containerStyle.marginLeft = ICON_SIZE + 8;
     }
-
     let leftIconColor;
-
     if (error) {
       leftIconColor = colors.error;
     } else if (this.state.focused) {
@@ -293,7 +255,6 @@ class TextField extends React.Component {
     } else {
       leftIconColor = colors.light;
     }
-
     const leftIconProps = {
       size: 24,
       color: leftIconColor,
@@ -304,7 +265,8 @@ class TextField extends React.Component {
       marginTop: type === "solid" ? MINIMIZED_LABEL_FONT_SIZE + 4 : leftIconMode === "outset" ? 16 : 0,
       marginLeft: leftIconMode === "inset" && type === "solid" ? 16 : 0
     };
-    const labelStyle = { ...typography.subtitle1,
+    const labelStyle = {
+      ...typography.subtitle1,
       top: type === "solid" ? 16 : 0,
       left: leftIconName && leftIconMode === "inset" ? ICON_SIZE + (type === "solid" ? 16 : 12) : 0,
       transform: [{
@@ -333,7 +295,6 @@ class TextField extends React.Component {
     const inputStyles = (0, _utilities.applyStyles)([styles.input, inputStyle, type === "solid" ? {
       marginHorizontal: 12
     } : {}], textStyles);
-
     const {
       backgroundColor: bgColor,
       padding,
@@ -350,12 +311,11 @@ class TextField extends React.Component {
       borderColor: borderCol,
       ...styleProp
     } = _reactNative.StyleSheet.flatten(style || {});
-
     return /*#__PURE__*/React.createElement(_reactNative.View, {
       style: [styles.container, styleProp]
-    }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
+    }, leftIconName && leftIconMode === "outset" ? /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
       style: leftIconStyle
-    }) : null, /*#__PURE__*/React.createElement(_reactNative.View, {
+    })) : null, /*#__PURE__*/React.createElement(_reactNative.View, {
       style: (0, _utilities.applyStyles)([containerStyle], {
         height: style === null || style === void 0 ? void 0 : style.height,
         backgroundColor: bgColor,
@@ -390,7 +350,8 @@ class TextField extends React.Component {
     React.createElement(_reactNative.View, {
       pointerEvents: "none",
       style: [_reactNative.StyleSheet.absoluteFill, {
-        opacity: // Hide the label in minimized state until we measure its width
+        opacity:
+        // Hide the label in minimized state until we measure its width
         this.state.value || this.state.focused ? this.state.labelLayout.measured ? 1 : 0 : 1
       }]
     }, /*#__PURE__*/React.createElement(AnimatedText, {
@@ -422,9 +383,9 @@ class TextField extends React.Component {
       style: {
         justifyContent: type === "solid" ? "center" : undefined
       }
-    }, /*#__PURE__*/React.createElement(Icon, { ...leftIconProps,
+    }, /*#__PURE__*/React.createElement(Icon, _extends({}, leftIconProps, {
       style: leftIconStyle
-    })) : null, render({
+    }))) : null, render({
       ref: c => {
         this._root = c;
       },
@@ -440,6 +401,7 @@ class TextField extends React.Component {
       underlineColorAndroid: "transparent",
       style: inputStyles,
       ...rest,
+      ...this.state.nativeProps,
       value: this.state.value
     })), rightIconName ? /*#__PURE__*/React.createElement(Icon, {
       name: rightIconName,
@@ -458,50 +420,9 @@ class TextField extends React.Component {
       }]
     }, assistiveText) : null);
   }
-
 }
-
 var _default = (0, _theming.withTheme)(TextField);
-
 exports.default = _default;
-
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    alignSelf: "stretch"
-  },
-  placeholder: {
-    position: "absolute",
-    left: 0
-  },
-  underline: {
-    position: "absolute",
-    left: 0,
-    right: 0,
-    bottom: 0,
-    height: 2
-  },
-  input: {
-    flexGrow: 1,
-    justifyContent: "center",
-    textAlignVertical: "center",
-    margin: 0,
-    textAlign: _reactNative.I18nManager.isRTL ? "right" : "left"
-  }
-});? /*#__PURE__*/React.createElement(_reactNative.Text, {
-      style: [{
-        color: error ? colors.error : colors.light,
-        marginTop: 8,
-        marginLeft: assistiveTextLeftMargin
-      }]
-    }, assistiveText) : null);
-  }
-
-}
-
-var _default = (0, _theming.withTheme)(TextField);
-
-exports.default = _default;
-
 const styles = _reactNative.StyleSheet.create({
   container: {
     alignSelf: "stretch"

package/lib/commonjs/components/ToggleButton.js

@@ -4,21 +4,14 @@ 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 ? 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); }
 const ToggleButton = _ref => {
   let {
     Icon,
@@ -50,13 +43,11 @@ const ToggleButton = _ref => {
       setInternalValue(defaultValue);
     }
   }, [defaultValue]);
-
   const handlePress = () => {
     setInternalValue(!internalValue);
     onPress(!internalValue);
   };
-
-  return /*#__PURE__*/React.createElement(_IconButton.default, {
+  return /*#__PURE__*/React.createElement(_IconButton.default, _extends({
     Icon: Icon,
     icon: icon,
     size: iconSize,
@@ -68,33 +59,13 @@ const ToggleButton = _ref => {
       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;th,
-      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;

package/lib/commonjs/components/Touchable.js

@@ -4,13 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = Touchable;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactNative = require("react-native");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+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); }
 function Touchable(_ref) {
   let {
     children,
@@ -19,22 +16,6 @@ function Touchable(_ref) {
     style,
     ...props
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
-    onPress: onPress,
-    disabled: disabled,
-    hitSlop: 8,
-    style: _ref2 => {
-      let {
-        pressed
-      } = _ref2;
-      return [{
-        opacity: pressed || disabled ? 0.75 : 1
-      }, style];
-    },
-    ...props
-  }, children);
-}rops
-  } = _ref;
   return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
     onPress: onPress,
     disabled: disabled,

package/lib/commonjs/components/Touchable.web.js

@@ -4,8 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _reactNative = require("react-native");
-
 var _default = _reactNative.TouchableOpacity;
 exports.default = _default;

package/lib/commonjs/components/Typography.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Title = exports.Subtitle = exports.Caption = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactNative = require("react-native");
-
 var _theming = require("../theming");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const Title = (0, _theming.withTheme)(_ref => {
   let {
     text,

package/lib/commonjs/components/useAuthState.js

@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAuthState = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 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; }
-
 const useAuthState = auth => {
   const [error, setError] = React.useState();
   const [value, setValue] = React.useState(auth.currentUser);
@@ -20,18 +16,13 @@ const useAuthState = auth => {
       list();
     };
   }, [auth]);
-
   const signInWithEmailAndPassword = (user, password) => {
     auth.signInWithEmailAndPassword(user, password).then(setValue).catch(setError);
   };
-
   const createUserWithEmailAndPassword = (user, password) => {
     auth.signInWithEmailAndPassword(user, password).then(setValue).catch(setError);
   };
-
   const signOut = () => auth.signOut();
-
   return [value, error, signInWithEmailAndPassword, signOut, createUserWithEmailAndPassword];
 };
-
 exports.useAuthState = useAuthState;

package/lib/commonjs/constants.js

@@ -4,16 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.APPROX_STATUSBAR_HEIGHT = void 0;
-
 var _reactNative = require("react-native");
-
 // @ts-ignore
 const expo = global.__expo;
 const DEFAULT_STATUSBAR_HEIGHT_EXPO = expo !== null && expo !== void 0 && expo.Constants ? expo.Constants.statusBarHeight : 0;
-
 const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
   android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
   ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
 });
-
 exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;

package/lib/commonjs/hooks.js

@@ -4,21 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.usePrevious = usePrevious;
-
 var _react = _interopRequireDefault(require("react"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function usePrevious(value) {
   // The ref object is a generic container whose current property is mutable
   // and can hold any value, similar to an instance property on a class
-  const ref = _react.default.useRef(); // Store current value in ref
-
+  const ref = _react.default.useRef();
 
+  // Store current value in ref
   _react.default.useEffect(() => {
     ref.current = value;
-  }, [value]); // Return previous value (happens before update in useEffect above)
-
+  }, [value]);
 
+  // Return previous value (happens before update in useEffect above)
   return ref.current;
 }