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

package/dist/cjs/Page/PageBody.js

@@ -1,56 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _system = require("../system");
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-function PageBody(_ref) {
-  var children = _ref.children,
-      inset = _ref.inset,
-      sidebar = _ref.sidebar,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children", "inset", "sidebar"]);
-  var themeProps = (0, _system.useThemeValue)('pageBody');
-  var childrenToRender = sidebar ? _react.Children.toArray([/*#__PURE__*/(0, _react.cloneElement)(sidebar, {
-    basis: 28
-  }), /*#__PURE__*/_react["default"].createElement(_StackView["default"], {
-    grow: 1,
-    padding: 3,
-    shrink: 1
-  }, children)]) : children;
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    padding: sidebar && !inset ? 0 : 3,
-    backgroundColor: "backgroundSecondary",
-    mediaQueries: {
-      md: {
-        axis: sidebar && !inset ? 'horizontal' : undefined
-      }
-    }
-  }, themeProps, restProps), inset ? /*#__PURE__*/_react["default"].createElement(_StackView["default"], {
-    borderColor: "separatorSecondary",
-    borderWidth: 1,
-    mediaQueries: {
-      md: {
-        axis: sidebar ? 'horizontal' : undefined
-      }
-    },
-    padding: sidebar ? null : 3,
-    radius: 3,
-    shrink: 1
-  }, childrenToRender) : childrenToRender);
-}
-
-var _default = PageBody;
-exports["default"] = _default;

package/dist/cjs/Page/PageButton.js

@@ -1,24 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _system = require("../system");
-
-var _Button = _interopRequireDefault(require("../Button"));
-
-function PageButton(props) {
-  var themeProps = (0, _system.useThemeValue)('pageButton');
-  return /*#__PURE__*/_react["default"].createElement(_Button["default"], (0, _extends2["default"])({
-    theme: "white"
-  }, themeProps, props));
-}
-
-var _default = PageButton;
-exports["default"] = _default;

package/dist/cjs/Page/PageDropdown.js

@@ -1,25 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _system = require("../system");
-
-var _Dropdown = _interopRequireDefault(require("../Dropdown"));
-
-function PageDropdown(props) {
-  var themeProps = (0, _system.useThemeValue)('pageDropdown');
-  return /*#__PURE__*/_react["default"].createElement(_Dropdown["default"], (0, _extends2["default"])({
-    theme: "white",
-    variant: "outline"
-  }, themeProps, props));
-}
-
-var _default = PageDropdown;
-exports["default"] = _default;

package/dist/cjs/Page/PageHeader.js

@@ -1,44 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _system = require("../system");
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-function PageHeader(_ref) {
-  var children = _ref.children,
-      toolbar = _ref.toolbar,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children", "toolbar"]);
-  var themeProps = (0, _system.useThemeValue)('pageHeader');
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    as: "header",
-    axis: "vertical",
-    backgroundColor: "primary-light",
-    paddingHorizontal: 2,
-    minHeight: 8,
-    mediaQueries: {
-      sm: {
-        paddingHorizontal: 3
-      }
-    },
-    spacing: 0
-  }, themeProps, restProps), children && /*#__PURE__*/_react["default"].createElement(_StackView["default"], {
-    alignment: "center",
-    axis: "horizontal",
-    paddingTop: 2,
-    width: "100%"
-  }, children), toolbar);
-}
-
-var _default = PageHeader;
-exports["default"] = _default;

package/dist/cjs/Page/PageTab.js

@@ -1,30 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _Tab = _interopRequireDefault(require("../Tab"));
-
-var _system = require("../system");
-
-function PageTab(props) {
-  var themeProps = (0, _system.useThemeValue)('pageTab');
-  return /*#__PURE__*/_react["default"].createElement(_Tab["default"], (0, _extends2["default"])({
-    mediaQueries: {
-      sm: {
-        paddingHorizontal: 3
-      }
-    },
-    paddingHorizontal: 1.5,
-    size: "lg"
-  }, themeProps, props));
-}
-
-var _default = PageTab;
-exports["default"] = _default;

package/dist/cjs/Page/PageTabList.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = PageTabList;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-function PageTabList(props) {
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    axis: "horizontal",
-    paddingTop: 2,
-    spacing: 0.5,
-    alignSelf: "end"
-  }, props));
-}

package/dist/cjs/Page/PageTitle.js

@@ -1,26 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _system = require("../system");
-
-var _Heading = _interopRequireDefault(require("../Heading"));
-
-function PageTitle(props) {
-  var themeProps = (0, _system.useThemeValue)('pageTitle');
-  return /*#__PURE__*/_react["default"].createElement(_Heading["default"], (0, _extends2["default"])({
-    color: "white",
-    fontSize: "25px",
-    level: 2
-  }, themeProps, props));
-}
-
-var _default = PageTitle;
-exports["default"] = _default;

package/dist/cjs/Page/PageToolbar.js

@@ -1,47 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-var _system = require("../system");
-
-function PageToolbar(_ref) {
-  var _mediaQueries;
-
-  var stackBelow = _ref.stackBelow,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["stackBelow"]);
-  var themeBreakpoints = (0, _system.useThemeValue)('breakpoints');
-  var breakpoint = Object.keys(themeBreakpoints).includes(stackBelow) ? stackBelow : 'sm';
-  var stackProps = stackBelow ? {
-    axis: 'vertical',
-    alignment: 'stretch',
-    spacing: 2,
-    mediaQueries: (_mediaQueries = {}, _mediaQueries[breakpoint] = {
-      axis: 'horizontal',
-      alignment: 'center',
-      paddingBottom: 0,
-      spacing: 0
-    }, _mediaQueries)
-  } : null;
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    alignment: "center",
-    axis: "horizontal",
-    distribution: "space-between",
-    flex: 1,
-    spacing: 2,
-    width: "100%"
-  }, stackProps, restProps));
-}
-
-var _default = PageToolbar;
-exports["default"] = _default;

package/dist/cjs/Page/index.js

@@ -1,41 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-
-var _PageActions = _interopRequireDefault(require("./PageActions"));
-
-exports.PageActions = _PageActions["default"];
-
-var _PageBody = _interopRequireDefault(require("./PageBody"));
-
-exports.PageBody = _PageBody["default"];
-
-var _PageButton = _interopRequireDefault(require("./PageButton"));
-
-exports.PageButton = _PageButton["default"];
-
-var _PageDropdown = _interopRequireDefault(require("./PageDropdown"));
-
-exports.PageDropdown = _PageDropdown["default"];
-
-var _PageHeader = _interopRequireDefault(require("./PageHeader"));
-
-exports.PageHeader = _PageHeader["default"];
-
-var _PageTab = _interopRequireDefault(require("./PageTab"));
-
-exports.PageTab = _PageTab["default"];
-
-var _PageTabList = _interopRequireDefault(require("./PageTabList"));
-
-exports.PageTabList = _PageTabList["default"];
-
-var _PageTitle = _interopRequireDefault(require("./PageTitle"));
-
-exports.PageTitle = _PageTitle["default"];
-
-var _PageToolbar = _interopRequireDefault(require("./PageToolbar"));
-
-exports.PageToolbar = _PageToolbar["default"];

package/dist/cjs/PagerView/PagerView.js

@@ -1,230 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _tinySpring = _interopRequireDefault(require("tiny-spring"));
-
-var _stylefire = _interopRequireDefault(require("stylefire"));
-
-var _tabbable = require("tabbable");
-
-var _popcorn = require("@popmotion/popcorn");
-
-var _GridView = _interopRequireDefault(require("../GridView"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-var _hooks = require("../hooks");
-
-var _utils = require("../utils");
-
-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 getRawTrackValue(_ref) {
-  var _ref$direction = _ref.direction,
-      direction = _ref$direction === void 0 ? 1 : _ref$direction,
-      _ref$multiplier = _ref.multiplier,
-      multiplier = _ref$multiplier === void 0 ? null : _ref$multiplier,
-      _ref$spacing = _ref.spacing,
-      spacing = _ref$spacing === void 0 ? 0 : _ref$spacing,
-      _ref$viewsToShow = _ref.viewsToShow,
-      viewsToShow = _ref$viewsToShow === void 0 ? 1 : _ref$viewsToShow;
-  spacing *= 8;
-  var viewSize = 100 / viewsToShow * direction;
-  var spacingSize = (spacing - spacing / viewsToShow) * direction;
-
-  if (multiplier !== null) {
-    viewSize *= multiplier;
-    spacingSize = spacingSize * multiplier - spacing * direction * multiplier;
-  }
-
-  if (viewsToShow === 1 && spacing === 0) {
-    spacingSize = 0;
-  }
-
-  return {
-    viewSize: viewSize,
-    spacingSize: spacingSize
-  };
-}
-
-function getTrackValue(_ref2) {
-  var viewSize = _ref2.viewSize,
-      spacingSize = _ref2.spacingSize;
-  return "calc(" + viewSize + "% - " + spacingSize + "px)";
-}
-
-function parseTrackValue(value) {
-  return parseFloat(value.includes('calc') ? value.split('(')[1].split('%')[0] : value);
-}
-
-var PageViewContext = /*#__PURE__*/(0, _react.createContext)({});
-
-function PagerView(props) {
-  var _trackProps;
-
-  var _props$axis = props.axis,
-      axis = _props$axis === void 0 ? 'horizontal' : _props$axis,
-      activeViewIndex = props.activeViewIndex,
-      _props$viewsToShow = props.viewsToShow,
-      viewsToShow = _props$viewsToShow === void 0 ? 1 : _props$viewsToShow,
-      _props$viewsToMove = props.viewsToMove,
-      viewsToMove = _props$viewsToMove === void 0 ? 1 : _props$viewsToMove,
-      _props$spacing = props.spacing,
-      spacing = _props$spacing === void 0 ? 0 : _props$spacing,
-      _props$autoFocus = props.autoFocus,
-      autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,
-      children = props.children,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(props, ["axis", "activeViewIndex", "viewsToShow", "viewsToMove", "spacing", "autoFocus", "children"]);
-  var isHorizontal = axis === 'horizontal';
-
-  var childCount = _react.Children.count(children);
-
-  var maxActiveIndex = childCount - viewsToShow;
-  var clampedIndex = (0, _popcorn.clamp)(0, maxActiveIndex, activeViewIndex * viewsToMove);
-  var visibleIndexes = (0, _utils.range)(0, viewsToShow).map(function (index) {
-    return clampedIndex + index;
-  });
-  var crossDimension = axis === 'horizontal' ? 'height' : 'width';
-  var frameRef = (0, _react.useRef)();
-  var frameStyler = (0, _react.useRef)();
-
-  var frameProps = _objectSpread({
-    innerRef: frameRef,
-    overflow: 'hidden'
-  }, restProps);
-
-  var trackRef = (0, _react.useRef)();
-  var trackStyler = (0, _react.useRef)();
-  var trackProps = (_trackProps = {
-    innerRef: trackRef,
-    alignment: isHorizontal ? 'start' : 'fill',
-    autoFlow: isHorizontal ? 'column' : 'row',
-    spacing: spacing
-  }, _trackProps[isHorizontal ? 'gridAutoColumns' : 'gridAutoRows'] = getTrackValue(getRawTrackValue({
-    spacing: spacing,
-    viewsToShow: viewsToShow
-  })), _trackProps);
-
-  var _useMeasure = (0, _hooks.useMeasure)(),
-      useMeasureRef = _useMeasure[0],
-      useMeasureEffect = _useMeasure[1];
-
-  useMeasureEffect(function (viewNodes) {
-    var viewMeasurements = viewNodes.map(function (node) {
-      return node.getBoundingClientRect();
-    });
-    var nextFrameSize = Math.max.apply(Math, visibleIndexes.map(function (index) {
-      var measurements = viewMeasurements[index];
-      return measurements ? measurements[crossDimension] : -1;
-    }));
-
-    if (frameStyler.current) {
-      var spring = (0, _tinySpring["default"])(frameStyler.current.get(crossDimension), {
-        stiffness: 500,
-        damping: 50
-      });
-      spring.onUpdate(function (value) {
-        return frameStyler.current.set(crossDimension, value);
-      });
-      spring.transitionTo(nextFrameSize);
-      return function () {
-        return spring.destroy();
-      };
-    } else {
-      frameStyler.current = (0, _stylefire["default"])(frameRef.current);
-      frameStyler.current.set(crossDimension, nextFrameSize);
-      frameStyler.current.render();
-    }
-  }, [activeViewIndex, viewsToShow]);
-  (0, _react.useLayoutEffect)(function () {
-    var trackAxis = isHorizontal ? 'x' : 'y';
-    var nextTrackValue = getRawTrackValue({
-      direction: -1,
-      multiplier: clampedIndex,
-      spacing: spacing,
-      viewsToShow: viewsToShow
-    });
-
-    if (trackStyler.current) {
-      var startValue = parseTrackValue(trackStyler.current.get(trackAxis));
-      var spring = (0, _tinySpring["default"])(startValue, {
-        stiffness: 500,
-        damping: 50
-      });
-      spring.onUpdate(function (value) {
-        trackStyler.current.set(trackAxis, getTrackValue({
-          viewSize: value,
-          spacingSize: nextTrackValue.spacingSize
-        }));
-      });
-      spring.transitionTo(nextTrackValue.viewSize);
-      return function () {
-        return spring.destroy();
-      };
-    } else {
-      trackStyler.current = (0, _stylefire["default"])(trackRef.current);
-      trackStyler.current.set(trackAxis, getTrackValue(nextTrackValue));
-      trackStyler.current.render();
-    }
-  }, [clampedIndex, spacing, viewsToShow]);
-  var lastTabbables = (0, _react.useRef)([]);
-  (0, _react.useLayoutEffect)(function () {
-    lastTabbables.current.forEach(function (node) {
-      return node.tabIndex = 0;
-    });
-    lastTabbables.current = [];
-
-    for (var index = 0; index < childCount; index++) {
-      var tabbables = (0, _tabbable.tabbable)(trackRef.current.children[index]);
-
-      if (autoFocus && index === clampedIndex) {
-        var firstTabbable = tabbables[0];
-
-        if (firstTabbable) {
-          firstTabbable.focus({
-            preventScroll: true
-          });
-        }
-      } // prevent tabbing to any outside views
-
-
-      if (!visibleIndexes.includes(index)) {
-        tabbables.forEach(function (node) {
-          return node.tabIndex = -1;
-        });
-      }
-
-      lastTabbables.current = [].concat(lastTabbables.current, tabbables);
-    }
-  }, [clampedIndex, viewsToShow]);
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], frameProps, /*#__PURE__*/_react["default"].createElement(_GridView["default"], trackProps, /*#__PURE__*/_react["default"].createElement(PageViewContext.Provider, {
-    value: useMeasureRef
-  }, children)));
-}
-
-PagerView.View = function (props) {
-  var useMeasureRef = (0, _react.useContext)(PageViewContext);
-  var viewRef = useMeasureRef();
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    innerRef: viewRef
-  }, props));
-};
-
-var _default = PagerView;
-exports["default"] = _default;

package/dist/cjs/PagerView/index.js

@@ -1,11 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _PagerView = _interopRequireDefault(require("./PagerView"));
-
-var _default = _PagerView["default"];
-exports["default"] = _default;