@planningcenter/tapestry-react 2.9.2 → 2.10.0-rc.1

package/dist/cjs/Badge/Badge.js

@@ -82,9 +82,13 @@ function Badge(_ref) {
   }
 
   if (badgeProps.radius === 'circle') {
-    textStyle.position = 'absolute';
-    textStyle.top = '50%';
-    textStyle.left = '50%';
+    // @ts-ignore error TS2339: Property 'position' does not exist on type ...
+    textStyle.position = 'absolute'; // @ts-ignore error TS2339: Property 'top' does not exist on type ...
+
+    textStyle.top = '50%'; // @ts-ignore error TS2339: Property 'left' does not exist on type ...
+
+    textStyle.left = '50%'; // @ts-ignore error TS2339: Property 'transform' does not exist on type ...
+
     textStyle.transform = 'translate(-50%, -50%)';
   }
 
@@ -121,8 +125,12 @@ function Badge(_ref) {
     position: "absolute",
     top: 0,
     left: 0
-  }, typeof renderLeft === 'string' ? renderLeft : /*#__PURE__*/(0, _react.cloneElement)(renderLeft, {
-    size: renderLeft.props && renderLeft.props.size || badgeProps.size
+  }, typeof renderLeft === 'string' ? renderLeft // @ts-ignore error TS2769: No overload matches this call.
+  :
+  /*#__PURE__*/
+  (0, _react.cloneElement)(renderLeft, {
+    size: // @ts-ignore error TS2339: Property 'props' does not exist on type ...
+    renderLeft.props && renderLeft.props.size || badgeProps.size
   })), typeof title === 'undefined' ? children : /*#__PURE__*/_react["default"].createElement(_Text["default"], textStyle, title), renderRight && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
     display: "flex",
     alignItems: "center",
@@ -132,8 +140,12 @@ function Badge(_ref) {
     position: "absolute",
     top: 0,
     right: 0
-  }, typeof renderRight === 'string' ? renderRight : /*#__PURE__*/(0, _react.cloneElement)(renderRight, {
-    size: renderRight.props && renderRight.props.size || badgeProps.size
+  }, typeof renderRight === 'string' ? renderRight // @ts-ignore error TS2769: No overload matches this call.
+  :
+  /*#__PURE__*/
+  (0, _react.cloneElement)(renderRight, {
+    size: // @ts-ignore error TS2339: Property 'props' does not exist on type ...
+    renderRight.props && renderRight.props.size || badgeProps.size
   })));
 }
 

package/dist/cjs/Badge/Status.js

@@ -11,12 +11,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
 
 var _system = require("../system");
@@ -36,79 +30,60 @@ var statuses = {
   }
 };
 
-/**
- * Used to show a reaction to saving user data
- */
-var Status = /*#__PURE__*/function (_Component) {
-  (0, _inheritsLoose2["default"])(Status, _Component);
-
-  function Status() {
-    var _this;
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "timeout", null);
-    return _this;
+var Status = function Status(_ref) {
+  var light = _ref.light,
+      onClearRequest = _ref.onClearRequest,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'sm' : _ref$size,
+      status = _ref.status,
+      title = _ref.title,
+      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["light", "onClearRequest", "size", "status", "title"]);
+
+  var _useState = (0, _react.useState)(null),
+      timeoutId = _useState[0],
+      setTimeoutId = _useState[1];
+
+  (0, _react.useEffect)(function () {
+    var requestClear = function requestClear() {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+      }
+
+      setTimeoutId(setTimeout(onClearRequest, 1800));
+    };
+
+    requestClear();
+    return function () {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+      }
+    };
+  }, [onClearRequest, status, timeoutId]);
+
+  if (!status) {
+    return null;
+  } else {
+    var _statuses$status = statuses[status],
+        color = _statuses$status.color,
+        icon = _statuses$status.icon;
+    return /*#__PURE__*/_react["default"].createElement(_Badge["default"], (0, _extends2["default"])({
+      color: light ? {
+        background: 'light',
+        foreground: (0, _system.getColor)(color)
+      } : (0, _system.getColor)(color),
+      fontWeight: 600,
+      paddingRight: 1,
+      radius: "pill",
+      renderLeft: /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
+        name: icon
+      }),
+      size: size,
+      title: title
+    }, restProps));
   }
+}; // @ts-ignore error TS2339: Property 'displayName' does not exist on type 'typeof Status'.
+
 
-  var _proto = Status.prototype;
-
-  _proto.componentDidMount = function componentDidMount() {
-    this.requestClear();
-  };
-
-  _proto.componentDidUpdate = function componentDidUpdate(lastProps) {
-    if (lastProps.status !== this.props.status) {
-      this.requestClear();
-    }
-  };
-
-  _proto.requestClear = function requestClear() {
-    if (this.timeout) {
-      clearTimeout(this.timeout);
-    }
-
-    this.timeout = setTimeout(this.props.onClearRequest, 1800);
-  };
-
-  _proto.render = function render() {
-    var _this$props = this.props,
-        status = _this$props.status,
-        light = _this$props.light,
-        onClearRequest = _this$props.onClearRequest,
-        props = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["status", "light", "onClearRequest"]);
-
-    if (!status) {
-      return null;
-    } else {
-      var _statuses$status = statuses[status],
-          color = _statuses$status.color,
-          icon = _statuses$status.icon;
-      return /*#__PURE__*/_react["default"].createElement(_Badge["default"], (0, _extends2["default"])({
-        paddingRight: 1,
-        radius: "pill",
-        renderLeft: /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
-          name: icon
-        }),
-        color: light ? {
-          background: 'light',
-          foreground: (0, _system.getColor)(color)
-        } : (0, _system.getColor)(color),
-        fontWeight: 600
-      }, props));
-    }
-  };
-
-  return Status;
-}(_react.Component);
-
-(0, _defineProperty2["default"])(Status, "defaultProps", {
-  title: '',
-  size: 'sm'
-});
 Status.displayName = 'Badge.Status';
 var _default = Status;
 exports["default"] = _default;

package/dist/cjs/Button/Button.js

@@ -78,7 +78,7 @@ function Button(_ref) {
     inline: true,
     lineHeight: lineHeight,
     position: 'relative',
-    radius: 3,
+    radius: 4,
     strokeAlign: 'inside',
     strokeWeight: 1,
     userSelect: 'none',

package/dist/cjs/Calendar/Day.js

@@ -40,7 +40,9 @@ var Day = function Day(_ref) {
       _ref$statusOffset = _ref.statusOffset,
       statusOffset = _ref$statusOffset === void 0 ? '15%' : _ref$statusOffset,
       restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["backgroundColor", "cellSize", "children", "color", "date", "disabled", "fontSize", "fontWeight", "inSameMonth", "isMinDate", "isMaxDate", "isSelected", "isToday", "selectDate", "selectedColor", "statusColor", "statuses", "statusOffset"]);
-  var affordance = !disabled && !isMinDate && !isMaxDate && (selectDate || restProps.onClick || restProps.onMouseDown);
+  var affordance = !disabled && !isMinDate && !isMaxDate && ( // @ts-ignore error TS2339: Property 'onClick' does not exist on type '{}'.
+  // @ts-ignore error TS2339: Property 'onMouseDown' does not exist on type '{}'.
+  selectDate || restProps.onClick || restProps.onMouseDown);
   return /*#__PURE__*/_react["default"].createElement(_StackView["default"], {
     width: cellSize,
     height: cellSize,
@@ -56,7 +58,8 @@ var Day = function Day(_ref) {
     width: "100%",
     height: "100%",
     alignment: "center",
-    distribution: "center",
+    distribution: "center" // @ts-ignore error TS2322: Type '"" | "none"' is not assignable to type 'PointerEvents'.
+    ,
     pointerEvents: (disabled || isMinDate || isMaxDate) && 'none',
     hover: affordance && {
       backgroundColor: 'highlight'

package/dist/cjs/Combobox/ComboboxPopover.js

@@ -45,6 +45,7 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
 
     _this = _Component.call.apply(_Component, [this].concat(args)) || this;
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      // @ts-ignore error TS2339: Property 'defaultOpen' does not exist on type 'Readonly<Props>'.
       isPopoverOpen: _this.props.defaultOpen || false
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "id", (0, _utils.generateId)('combobox'));
@@ -52,15 +53,18 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "inputTouched", false);
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "closeRequestId", null);
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setItemListRef", function (component) {
+      // @ts-ignore error TS2339: Property 'itemList' does not exist on type 'ComboboxPopover'.
       _this.itemList = component;
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setInputRef", function (component) {
+      // @ts-ignore error TS2339: Property 'input' does not exist on type 'ComboboxPopover'.
       _this.input = component;
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "openPopover", function () {
       _this.setState({
         isPopoverOpen: true
       }, function () {
+        // @ts-ignore error TS2339: Property 'itemList' does not exist on type 'ComboboxPopover'.
         _this.itemList.setHighlightedIndex(0, {
           maybeScrollIntoView: false
         });
@@ -72,6 +76,7 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
         _this.setState({
           isPopoverOpen: false
         }, function () {
+          // @ts-ignore error TS2339: Property 'itemList' does not exist on type 'ComboboxPopover'.
           _this.itemList.clearHighlightedIndex();
         });
       });
@@ -79,18 +84,21 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBlur", function (event) {
       _this.closePopover();
 
-      _this.inputTouched = false;
+      _this.inputTouched = false; // @ts-ignore error TS2339: Property 'onBlur' does not exist on type 'Readonly<Props>'.
 
       if (_this.props.onBlur) {
+        // @ts-ignore error TS2339: Property 'onBlur' does not exist on type 'Readonly<Props>'.
         _this.props.onBlur(event);
       }
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSelect", function (event) {
       if (_this.props.closeOnSelect) {
         _this.closePopover();
-      }
+      } // @ts-ignore error TS2339: Property 'onSelect' does not exist on type 'Readonly<Props>'.
+
 
       if (_this.props.onSelect) {
+        // @ts-ignore error TS2339: Property 'onSelect' does not exist on type 'Readonly<Props>'.
         _this.props.onSelect(event);
       }
     });
@@ -100,13 +108,16 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
   var _proto = ComboboxPopover.prototype;
 
   _proto.componentDidUpdate = function componentDidUpdate(lastProps) {
-    if (lastProps.disabled !== lastProps.disabled && this.props.disabled === true) {
+    if (lastProps.disabled !== lastProps.disabled && // @ts-ignore error TS2339: Property 'disabled' does not exist on type 'Readonly<Props>'.
+    this.props.disabled === true) {
       this.closePopover();
     }
 
     var isComboboxFocused = document.activeElement === this.inputNode;
 
-    if (isComboboxFocused && lastProps.value !== this.props.value && this.props.value.length > 0 && !this.state.isPopoverOpen) {
+    if (isComboboxFocused && // @ts-ignore error TS2339: Property 'value' does not exist on type 'Readonly<Props>'.
+    lastProps.value !== this.props.value && // @ts-ignore error TS2339: Property 'value' does not exist on type 'Readonly<Props>'.
+    this.props.value.length > 0 && !this.state.isPopoverOpen) {
       this.openPopover();
     }
   };
@@ -159,6 +170,7 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
         }, popoverProps, {
           as: _Menu["default"],
           ref: function ref(component) {
+            // @ts-ignore error TS2339: Property 'popover' does not exist on type 'ComboboxPopover'.
             _this2.popover = component;
           },
           innerRef: function innerRef(node) {
@@ -172,7 +184,8 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
           relativeTo: relativeTo,
           renderTo: renderTo,
           open: isPopoverOpen,
-          onBlur: requestBlur,
+          onBlur: requestBlur // @ts-ignore error TS2322: Type '(anchorProps: any) => Element' is not assignable to type 'ReactElement<...
+          ,
           anchorElement: function anchorElement(anchorProps) {
             return /*#__PURE__*/_react["default"].createElement(_ComboboxInput["default"], (0, _extends2["default"])({
               ref: _this2.setInputRef,
@@ -225,7 +238,8 @@ var ComboboxPopover = /*#__PURE__*/function (_Component) {
                     _this2.closePopover();
                   } else {
                     _this2.openPopover();
-                  }
+                  } // @ts-ignore error TS2339: Property 'input' does not exist on type 'ComboboxPopover'.
+
 
                   _this2.input.focus();
                 }

package/dist/cjs/Input/Inline.js

@@ -49,7 +49,7 @@ function Inline(_ref) {
     paddingHorizontal: 0.5,
     paddingVertical: 0,
     placeholderColor: light ? 'light-5' : 'foregroundTertiary',
-    radius: 3,
+    radius: 4,
     stroke: undefined
   }, restProps));
 }

package/dist/cjs/Input/InputBox.js

@@ -305,7 +305,7 @@ var InputBox = /*#__PURE__*/function (_Component) {
       alignment: _StackView["default"].CENTER,
       shrink: 0,
       minHeight: boxSize,
-      radius: 3,
+      radius: 4,
       position: "relative",
       cursor: "text",
       outline: 0,

package/dist/cjs/Menu/Item.js

@@ -43,10 +43,12 @@ function Item(_ref) {
   };
 
   if (renderLeft) {
+    // @ts-ignore error TS2339: Property 'paddingLeft' does not exist on type
     css.paddingLeft = 5;
   }
 
   if (renderRight) {
+    // @ts-ignore error TS2339: Property 'paddingRight' does not exist on type
     css.paddingRight = 5;
   }
 
@@ -55,35 +57,55 @@ function Item(_ref) {
   }
 
   if (disabled) {
-    css.cursor = 'not-allowed';
+    // @ts-ignore error TS2339: Property 'cursor' does not exist on type ...
+    css.cursor = 'not-allowed'; // @ts-ignore error TS2339: Property 'opacity' does not exist on type ...
+
     css.opacity = 0.65;
-  } else if (props.onClick || props.onDoubleClick || props.onMouseDown || props.onMouseUp) {
+  } else if ( // @ts-ignore error TS2339: Property 'onClick' does not exist on type '{}'.
+  props.onClick || // @ts-ignore error TS2339: Property 'onDoubleClick' does not exist on type '{}'.
+  props.onDoubleClick || // @ts-ignore error TS2339: Property 'onMouseDown' does not exist on type '{}'.
+  props.onMouseDown || // @ts-ignore error TS2339: Property 'onMouseUp' does not exist on type '{}'.
+  props.onMouseUp) {
+    // @ts-ignore error TS2339: Property 'cursor' does not exist on type ...
     css.cursor = 'pointer';
   }
 
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({}, css, props), renderLeft && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    width: 4,
-    height: "100%",
-    position: "absolute",
-    top: 0,
-    left: 0.5
-  }, typeof renderLeft === 'function' ? renderRight() : /*#__PURE__*/(0, _react.cloneElement)(renderLeft, {
-    size: renderLeft.props && renderLeft.props.size || 'md'
-  })), children, renderRight && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    width: 4,
-    height: "100%",
-    position: "absolute",
-    top: 0,
-    right: 0.5
-  }, typeof renderRight === 'function' ? renderRight() : /*#__PURE__*/(0, _react.cloneElement)(renderRight, {
-    size: renderRight.props && renderRight.props.size || 'md'
-  })));
+  return (
+    /*#__PURE__*/
+    // @ts-ignore error TS2322: Type '{ ... }' is not assignable to type ...
+    _react["default"].createElement(_StackView["default"], (0, _extends2["default"])({}, css, props), renderLeft && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      width: 4,
+      height: "100%",
+      position: "absolute",
+      top: 0,
+      left: 0.5
+    }, typeof renderLeft === 'function' // @ts-ignore error TS2349: This expression is not callable.
+    ? renderRight() // @ts-ignore error TS2769: No overload matches this call.
+    :
+    /*#__PURE__*/
+    (0, _react.cloneElement)(renderLeft, {
+      // @ts-ignore error TS2339: Property 'props' does not exist on type ...
+      size: renderLeft.props && renderLeft.props.size || 'md'
+    })), children, renderRight && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      width: 4,
+      height: "100%",
+      position: "absolute",
+      top: 0,
+      right: 0.5
+    }, typeof renderRight === 'function' ? renderRight() // @ts-ignore error TS2769: No overload matches this call.
+    :
+    /*#__PURE__*/
+    (0, _react.cloneElement)(renderRight, {
+      // @ts-ignore error TS2339: Property 'props' does not exist on type ...
+      size: renderRight.props && renderRight.props.size || 'md'
+    })))
+  );
 }
 
 Item.displayName = 'Menu.Item';

package/dist/cjs/Modal/Modal.js

@@ -23,9 +23,10 @@ var _utils = require("../utils");
 
 var _system = require("../system");
 
-function Modal(_ref) {
+var Modal = function Modal(_ref) {
   var children = _ref.children,
-      closeOnOutsideClick = _ref.closeOnOutsideClick,
+      _ref$closeOnOutsideCl = _ref.closeOnOutsideClick,
+      closeOnOutsideClick = _ref$closeOnOutsideCl === void 0 ? false : _ref$closeOnOutsideCl,
       onRequestClose = _ref.onRequestClose,
       open = _ref.open,
       restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children", "closeOnOutsideClick", "onRequestClose", "open"]);
@@ -69,7 +70,7 @@ function Modal(_ref) {
     radius: 8,
     width: "100%"
   }, themeProps), children));
-}
+};
 
 var _default = Modal;
 exports["default"] = _default;