@planningcenter/tapestry-react 2.0.0 → 2.1.0

package/dist/cjs/Pagination/Pagination.js

@@ -1,32 +1,38 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports["default"] = void 0;
+exports["default"] = Pagination;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _Box = _interopRequireDefault(require("../Box"));
 
 var _Button = _interopRequireDefault(require("../Button"));
 
+var _Group = _interopRequireDefault(require("../Group"));
+
 var _StackView = _interopRequireDefault(require("../StackView"));
 
 var _utils = require("../utils");
 
+var _windowSize = require("@react-hook/window-size");
+
+var _system = require("../system");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 function getVisiblePages(currentPage, totalPages, visiblePages) {
-  var start = Math.max(1, Math.min(totalPages - visiblePages + 1, currentPage - visiblePages / 2 + 1));
+  var start = Math.max(1, Math.min(totalPages - visiblePages + 1, Math.floor(currentPage - visiblePages / 2 + 1)));
   var stop = Math.min(totalPages, start + visiblePages - 1);
   var primaryWindow = (0, _utils.range)(start, stop + 1);
   var showFirstPage = start > 1;
@@ -47,104 +53,114 @@ function getVisiblePages(currentPage, totalPages, visiblePages) {
   return first.concat(primaryWindow).concat(last);
 }
 
-var Pagination = /*#__PURE__*/function (_Component) {
-  (0, _inheritsLoose2["default"])(Pagination, _Component);
+var NavButton = function NavButton(_ref) {
+  var disabled = _ref.disabled,
+      iconName = _ref.iconName,
+      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["disabled", "iconName"]);
+  return /*#__PURE__*/_react["default"].createElement(_Button["default"], (0, _extends2["default"])({
+    backgroundColor: disabled ? '#f7f7f7' : '#f2f2f2',
+    disabled: disabled,
+    icon: {
+      color: disabled ? '#cfcfcf' : undefined,
+      name: iconName,
+      size: 'xs'
+    },
+    opacity: 1,
+    shrink: 0,
+    square: true,
+    variant: "fill"
+  }, props));
+};
+
+function Pagination(_ref2) {
+  var _ref2$activeColor = _ref2.activeColor,
+      activeColor = _ref2$activeColor === void 0 ? '#5b8bf7' : _ref2$activeColor,
+      currentPage = _ref2.currentPage,
+      _ref2$onPageChange = _ref2.onPageChange,
+      onPageChange = _ref2$onPageChange === void 0 ? function () {
+    return null;
+  } : _ref2$onPageChange,
+      visiblePages = _ref2.visiblePages,
+      _ref2$totalPages = _ref2.totalPages,
+      totalPages = _ref2$totalPages === void 0 ? 0 : _ref2$totalPages,
+      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref2, ["activeColor", "currentPage", "onPageChange", "visiblePages", "totalPages"]);
 
-  function Pagination() {
-    return _Component.apply(this, arguments) || this;
-  }
+  var _useThemeValue = (0, _system.useThemeValue)('breakpoints'),
+      xsBreakpoint = _useThemeValue.xs;
 
-  var _proto = Pagination.prototype;
+  var currentWidth = (0, _windowSize.useWindowWidth)();
 
-  _proto.renderGap = function renderGap(key) {
+  function renderGap(key) {
     return /*#__PURE__*/_react["default"].createElement(_Box["default"], {
       key: key,
       userSelect: "none",
       cursor: "default",
       children: "\u2026"
     });
-  };
+  }
 
-  _proto.renderPageLink = function renderPageLink(number) {
-    var isActive = this.props.currentPage === number;
-    return /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+  function renderPageLink(number) {
+    var isActive = currentPage === number;
+    var outlineStyle = {
+      border: '1px solid #5b8bf7',
+      color: '#5b8bf7'
+    };
+    return /*#__PURE__*/_react["default"].createElement(_Button["default"], (0, _extends2["default"])({
       key: number,
-      onClick: this.props.onPageChange.bind(null, number),
-      theme: isActive ? this.props.activeColor : undefined,
-      variant: isActive ? 'fill' : 'naked',
-      title: number,
+      focus: _objectSpread({
+        backgroundColor: '#f4f8fd'
+      }, outlineStyle),
+      fontWeight: 500,
+      hover: _objectSpread({
+        backgroundColor: '#ffffff'
+      }, outlineStyle),
+      onClick: onPageChange.bind(null, number),
       shrink: 0,
-      square: true
-    });
-  };
-
-  _proto.renderPageLinks = function renderPageLinks() {
-    var _this = this;
+      square: true,
+      title: number,
+      variant: isActive ? 'fill' : 'naked'
+    }, isActive && {
+      backgroundColor: '#5b8bf7',
+      color: 'white'
+    }));
+  }
 
-    var pages = getVisiblePages(this.props.currentPage, this.props.totalPages, this.props.visiblePages);
+  function renderPageLinks() {
+    var visiblePagesToShow = currentWidth <= xsBreakpoint ? visiblePages || 5 : visiblePages || 7;
+    var pages = getVisiblePages(currentPage, totalPages, visiblePagesToShow);
     return pages.map(function (page, index) {
-      return page === '...' ? _this.renderGap(page + index) : _this.renderPageLink(page);
+      return page === '...' ? renderGap(page + index) : renderPageLink(page);
     });
-  };
-
-  _proto.render = function render() {
-    var _this$props = this.props,
-        activeColor = _this$props.activeColor,
-        currentPage = _this$props.currentPage,
-        totalPages = _this$props.totalPages,
-        visiblePages = _this$props.visiblePages,
-        onPageChange = _this$props.onPageChange,
-        restProps = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["activeColor", "currentPage", "totalPages", "visiblePages", "onPageChange"]);
-
-    if (totalPages <= 1) {
-      return null;
-    }
+  }
 
+  if (totalPages <= 1) {
+    return null;
+  } else {
     return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-      axis: "horizontal",
       alignment: "center",
+      axis: "horizontal",
       distribution: "center",
-      width: "100%",
+      overflow: "auto",
       paddingVertical: 1,
       shrink: 0,
-      overflow: "auto"
-    }, restProps), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      onClick: onPageChange.bind(null, currentPage - 1),
+      spacing: 0.5,
+      width: "100%"
+    }, restProps), /*#__PURE__*/_react["default"].createElement(_Group["default"], {
+      spacing: 0.5
+    }, /*#__PURE__*/_react["default"].createElement(NavButton, {
       disabled: currentPage === 1,
-      icon: {
-        name: 'general.leftChevron',
-        size: 'xs'
-      },
+      iconName: "general.leftChevron",
+      onClick: onPageChange.bind(null, currentPage - 1),
       tooltip: {
         title: 'Previous Page'
-      },
-      variant: "naked",
-      shrink: 0
-    }), this.renderPageLinks(), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      onClick: onPageChange.bind(null, currentPage + 1),
+      }
+    }), /*#__PURE__*/_react["default"].createElement(NavButton, {
       disabled: currentPage === totalPages,
-      icon: {
-        name: 'general.rightChevron',
-        size: 'xs'
-      },
+      iconName: "general.rightChevron",
+      onClick: onPageChange.bind(null, currentPage + 1),
       tooltip: {
         title: 'Next Page'
-      },
-      variant: "naked",
-      shrink: 0
-    }));
-  };
-
-  return Pagination;
-}(_react.Component);
-
-(0, _defineProperty2["default"])(Pagination, "defaultProps", {
-  activeColor: 'primary',
-  onPageChange: function onPageChange() {
-    return null;
-  },
-  visiblePages: 8,
-  totalPages: 0
-});
-var _default = Pagination;
-exports["default"] = _default;
+      }
+    })), renderPageLinks());
+  }
+}

package/dist/cjs/Scrim/Scrim.js

@@ -13,7 +13,7 @@ var React = _interopRequireWildcard(require("react"));
 
 var _StackView = _interopRequireDefault(require("../StackView"));
 
-var Scrim = /*#__PURE__*/React.forwardRef(function (props) {
+var Scrim = /*#__PURE__*/React.forwardRef(function (props, _ref) {
   React.useLayoutEffect(function () {
     document.body.style.overflow = 'hidden';
     return function () {

package/dist/cjs/Select/Inline.js

@@ -47,5 +47,6 @@ function Inline(_ref) {
   }, restProps));
 }
 
+Inline.displayName = 'Select.Inline';
 var _default = Inline;
 exports["default"] = _default;

package/dist/cjs/Select/Option.js

@@ -98,6 +98,6 @@ var Option = /*#__PURE__*/function (_Component) {
   return Option;
 }(_react.Component);
 
-(0, _defineProperty2["default"])(Option, "displayName", _constants.OPTION_DISPLAY_NAME);
+(0, _defineProperty2["default"])(Option, "displayName", 'Select.Option');
 var _default = Option;
 exports["default"] = _default;

package/dist/cjs/Select/OptionGroup.js

@@ -11,8 +11,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = require("react");
 
-var _constants = require("./constants");
-
 var OptionGroup = /*#__PURE__*/function (_Component) {
   (0, _inheritsLoose2["default"])(OptionGroup, _Component);
 
@@ -29,6 +27,6 @@ var OptionGroup = /*#__PURE__*/function (_Component) {
   return OptionGroup;
 }(_react.Component);
 
-(0, _defineProperty2["default"])(OptionGroup, "displayName", _constants.OPTIONGROUP_DISPLAY_NAME);
+(0, _defineProperty2["default"])(OptionGroup, "displayName", 'Select.OptionGroup');
 var _default = OptionGroup;
 exports["default"] = _default;

package/dist/cjs/Select/Value.js

@@ -23,5 +23,6 @@ function Value(props) {
   }, props));
 }
 
+Value.displayName = 'Select.Value';
 var _default = Value;
 exports["default"] = _default;

package/dist/cjs/Select/constants.js

@@ -4,7 +4,7 @@ exports.__esModule = true;
 exports.OPTION_DISPLAY_NAME = exports.OPTIONGROUP_DISPLAY_NAME = exports.SELECT_DISPLAY_NAME = void 0;
 var SELECT_DISPLAY_NAME = 'Select';
 exports.SELECT_DISPLAY_NAME = SELECT_DISPLAY_NAME;
-var OPTIONGROUP_DISPLAY_NAME = 'OptionGroup';
+var OPTIONGROUP_DISPLAY_NAME = 'Select.OptionGroup';
 exports.OPTIONGROUP_DISPLAY_NAME = OPTIONGROUP_DISPLAY_NAME;
-var OPTION_DISPLAY_NAME = 'Option';
+var OPTION_DISPLAY_NAME = 'Select.Option';
 exports.OPTION_DISPLAY_NAME = OPTION_DISPLAY_NAME;

package/dist/cjs/Sidebar/Sidebar.js

@@ -9,9 +9,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = require("react");
+var _react2 = require("react");
 
 var _reactStickyBox = _interopRequireDefault(require("react-sticky-box"));
 
@@ -34,14 +34,14 @@ var flexColumnCss = (0, _system.css)({
 function Sidebar(_ref) {
   var children = _ref.children,
       restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children"]);
-  return (0, _core.jsx)(_StackView["default"], (0, _extends2["default"])({
+  return (0, _react.jsx)(_StackView["default"], (0, _extends2["default"])({
     grow: 1,
     paddingTop: 2,
     boxShadow: "inset -8px 0px 8px -8px rgba(150, 150, 150, 0.25)",
     backgroundColor: "surfaceTertiary"
-  }, restProps), (0, _core.jsx)(_reactStickyBox["default"], {
+  }, restProps), (0, _react.jsx)(_reactStickyBox["default"], {
     css: flexColumnCss
-  }, _react.Children.map(children, function (child) {
+  }, _react2.Children.map(children, function (child) {
     if (child && child.type !== Sidebar.List || child && child.type !== Sidebar.Item) {
       console.warn("Invalid component nesting. " + child.type + " cannot appear as a child of <Sidebar>. Only <Sidebar.List/> or <Sidebar.Item/> may be used.");
     }

package/dist/cjs/Spinner/Spinner.js

@@ -11,18 +11,18 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 
 var _react = _interopRequireDefault(require("react"));
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _Box = require("../Box");
 
 var _system = require("../system");
 
-var rotate = (0, _core.keyframes)({
+var rotate = (0, _react2.keyframes)({
   '100%': {
     transform: 'rotate(360deg)'
   }
 });
-var rotateCentered = (0, _core.keyframes)({
+var rotateCentered = (0, _react2.keyframes)({
   '100%': {
     transform: 'translate(-50%, -50%) rotate(360deg)'
   }

package/dist/cjs/StackView/StackView.js

@@ -13,7 +13,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -83,7 +83,7 @@ function StackView(_ref2) {
   var Element = as || defaultElement;
   var variant = (0, _VariantProvider.useVariant)();
   var childrenToRender = Element === 'textarea' ? undefined : typeof props.spacing === 'object' ? (0, _utils.joinChildren)(children, props.spacing) : children;
-  return (0, _core.jsx)(Element, (0, _extends2["default"])({
+  return (0, _react.jsx)(Element, (0, _extends2["default"])({
     ref: innerRef
   }, (0, _splitStyles["default"])(_objectSpread({
     display: inline ? 'inline-flex' : 'flex',

package/dist/cjs/Table/Table.js

@@ -19,7 +19,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _lodash = require("lodash");
 
@@ -417,7 +417,7 @@ var Table = /*#__PURE__*/function (_PureComponent) {
     var isLoadingOrNoData = loading || data.length <= 0;
     return /*#__PURE__*/_react["default"].createElement(_TableWrapper["default"], (0, _extends2["default"])({}, restProps, {
       position: "relative"
-    }), /*#__PURE__*/_react["default"].createElement(_core.Global, {
+    }), /*#__PURE__*/_react["default"].createElement(_react2.Global, {
       styles: {
         html: {
           userSelect: this.state.isSorting ? 'none' : null

package/dist/cjs/Text/Text.js

@@ -13,7 +13,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -89,7 +89,7 @@ function Text(_ref2) {
 
   var Element = as || (inline ? 'p' : defaultElement);
   var variant = (0, _VariantProvider.useVariant)();
-  return (0, _core.jsx)(Element, (0, _extends2["default"])({
+  return (0, _react.jsx)(Element, (0, _extends2["default"])({
     ref: innerRef
   }, (0, _splitStyles["default"])(_objectSpread({
     display: inline ? 'inline-block' : 'block',

package/dist/cjs/ThemeProvider/ThemeProvider.js

@@ -12,9 +12,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _emotionTheming = require("emotion-theming");
-
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _cache = _interopRequireDefault(require("@emotion/cache"));
 
@@ -37,19 +35,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var STORAGE_KEY = 'tapestry-react-theme';
 var cache = (0, _cache["default"])({
-  key: 'tapestry-react',
-  prefix: function prefix(key) {
-    switch (key) {
-      case 'appearance':
-      case 'user-select':
-      case 'position':
-      case ':placeholder':
-        return true;
-
-      default:
-        return false;
-    }
-  }
+  key: 'tapestry-react'
 });
 exports.cache = cache;
 var themeStorage = {
@@ -107,9 +93,9 @@ function ThemeProvider(_ref) {
       setMergedTheme(nextTheme);
     }
   }, [theme]);
-  return /*#__PURE__*/_react["default"].createElement(_core.CacheProvider, {
+  return /*#__PURE__*/_react["default"].createElement(_react2.CacheProvider, {
     value: cache
-  }, /*#__PURE__*/_react["default"].createElement(_emotionTheming.ThemeProvider, {
+  }, /*#__PURE__*/_react["default"].createElement(_react2.ThemeProvider, {
     theme: mergedTheme
   }, children));
 }

package/dist/cjs/TileView/TileView.js

@@ -13,7 +13,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -54,7 +54,7 @@ function TileView(_ref2) {
       props = (0, _objectWithoutPropertiesLoose2["default"])(_ref2, ["as", "innerRef"]);
   var Element = as || defaultElement;
   var variant = (0, _VariantProvider.useVariant)();
-  return (0, _core.jsx)(Element, (0, _extends2["default"])({
+  return (0, _react.jsx)(Element, (0, _extends2["default"])({
     ref: innerRef
   }, (0, _splitStyles["default"])(_objectSpread({
     display: 'grid',

package/dist/cjs/system/box-sizes.js

@@ -23,7 +23,7 @@ var boxSizes = {
     radius: 3
   },
   md: {
-    boxSize: 4,
+    boxSize: 4.5,
     fontSize: 4,
     lineHeight: 3,
     paddingHorizontalDense: 1,
@@ -32,7 +32,7 @@ var boxSizes = {
     radius: 4
   },
   lg: {
-    boxSize: 5,
+    boxSize: 6,
     fontSize: 3,
     lineHeight: 4,
     paddingHorizontalDense: 1,
@@ -41,13 +41,16 @@ var boxSizes = {
     radius: 5
   },
   xl: {
-    boxSize: 8,
+    boxSize: 9,
     fontSize: 1,
     lineHeight: 5,
     paddingHorizontalDense: 2,
     paddingHorizontal: 2.25,
     paddingVertical: 1.5,
     radius: 6
+  },
+  xxl: {
+    boxSize: 14
   }
 };
 exports.boxSizes = boxSizes;

package/dist/cjs/system/use-css.js

@@ -7,14 +7,14 @@ exports["default"] = useCss;
 
 var _react = require("react");
 
-var _emotionTheming = require("emotion-theming");
+var _react2 = require("@emotion/react");
 
 var _cxs = _interopRequireDefault(require("./cxs"));
 
 var _parseStyles = require("./parse-styles");
 
 function useCss() {
-  var theme = (0, _emotionTheming.useTheme)();
+  var theme = (0, _react2.useTheme)();
   return (0, _react.useCallback)(function (styles) {
     return (0, _cxs["default"])((0, _parseStyles.parseCssStyles)(styles, null, theme));
   }, [theme]);

package/dist/cjs/system/utils.js

@@ -20,7 +20,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = require("react");
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _polished = require("polished");
 
@@ -160,7 +160,7 @@ function getForegroundColor(color) {
 }
 
 function useThemeValue(path, defaultValue) {
-  var userTheme = (0, _react.useContext)(_core.ThemeContext);
+  var userTheme = (0, _react.useContext)(_react2.ThemeContext);
   return path ? (0, _lodash.get)(userTheme, path, defaultValue || (0, _lodash.get)(_defaultTheme["default"], path)) : userTheme || _defaultTheme["default"];
 }
 

package/dist/esm/Avatar/Avatar.js

@@ -8,13 +8,14 @@ var borderSizes = {
   sm: 2,
   md: 3,
   lg: 4,
-  xl: 5
+  xl: 4,
+  xxl: 4
 };
 
 /**
  * Displays a user's avatar in a circle.
  */
-function Avatar(_ref) {
+export function Avatar(_ref) {
   var _ref$size = _ref.size,
       size = _ref$size === void 0 ? 'md' : _ref$size,
       source = _ref.source,
@@ -38,5 +39,4 @@ function Avatar(_ref) {
     borderWidth: status ? borderSizes[size] : 0
   }, restProps));
 }
-
 export default Avatar;

package/dist/esm/Box/Box.js

@@ -9,7 +9,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
-import { jsx } from '@emotion/core';
+import { jsx } from '@emotion/react';
 import * as React from 'react';
 import splitStyles from '../system/split-styles';
 import { useVariant } from '../VariantProvider';

package/dist/esm/Button/Button.js

@@ -19,13 +19,13 @@ import Input from './Input';
 
 var _ref2 = /*#__PURE__*/React.createElement(Link, {
   external: true,
-  to: "https://ministrycentered.github.io/tapestry-react/button#tooltip",
+  to: "https://planningcenter.github.io/tapestry-react/button#tooltip",
   weight: 700
 }, "tooltip");
 
 var _ref3 = /*#__PURE__*/React.createElement(Link, {
   external: true,
-  to: "https://ministrycentered.github.io/tapestry-react/button#title",
+  to: "https://planningcenter.github.io/tapestry-react/button#title",
   weight: 700
 }, "title");
 

package/dist/esm/Calendar/Day.js

@@ -89,4 +89,5 @@ var Day = function Day(_ref2) {
   }))));
 };
 
+Day.displayName = 'Calendar.Day';
 export default Day;

package/dist/esm/Card/Card.js

@@ -3,23 +3,14 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 import * as React from 'react';
 import { useThemeValue } from '../system';
 import { StackView } from '../StackView';
+import { Section } from './Section';
 import { cloneChildren } from '../utils';
-export function Section(_ref) {
-  var subdued = _ref.subdued,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["subdued"]);
-
-  return /*#__PURE__*/React.createElement(StackView, _extends({
-    width: "100%",
-    padding: 1,
-    backgroundColor: subdued ? 'surfaceSecondary' : undefined
-  }, restProps));
-}
-export function Card(_ref2) {
-  var children = _ref2.children,
-      subdued = _ref2.subdued,
-      _ref2$radius = _ref2.radius,
-      radius = _ref2$radius === void 0 ? 3 : _ref2$radius,
-      restProps = _objectWithoutPropertiesLoose(_ref2, ["children", "subdued", "radius"]);
+export function Card(_ref) {
+  var children = _ref.children,
+      subdued = _ref.subdued,
+      _ref$radius = _ref.radius,
+      radius = _ref$radius === void 0 ? 3 : _ref$radius,
+      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "subdued", "radius"]);
 
   var cardTheme = useThemeValue('card');
   return /*#__PURE__*/React.createElement(StackView, _extends({
@@ -31,13 +22,12 @@ export function Card(_ref2) {
     backgroundColor: subdued ? 'surfaceSecondary' : 'surface',
     color: "foreground",
     radius: radius
-  }, cardTheme, restProps), radius > 0 ? cloneChildren(children, function (child, _ref3) {
-    var _ref4, _ref5;
+  }, cardTheme, restProps), radius > 0 ? cloneChildren(children, function (child, _ref2) {
+    var _ref3, _ref4;
 
-    var firstChild = _ref3.firstChild,
-        lastChild = _ref3.lastChild;
-    return child.props.radius === undefined ? firstChild ? (_ref4 = {}, _ref4["radius" + (restProps.axis === 'horizontal' ? 'Left' : 'Top')] = radius - 1, _ref4) : lastChild ? (_ref5 = {}, _ref5["radius" + (restProps.axis === 'horizontal' ? 'Right' : 'Bottom')] = radius - 1, _ref5) : {} : {};
+    var firstChild = _ref2.firstChild,
+        lastChild = _ref2.lastChild;
+    return child.props.radius === undefined ? firstChild ? (_ref3 = {}, _ref3["radius" + (restProps.axis === 'horizontal' ? 'Left' : 'Top')] = radius - 1, _ref3) : lastChild ? (_ref4 = {}, _ref4["radius" + (restProps.axis === 'horizontal' ? 'Right' : 'Bottom')] = radius - 1, _ref4) : {} : {};
   }) : children);
 }
-Section.displayName = 'Card.Section';
 Card.Section = Section;