@planningcenter/tapestry-react 3.0.0 → 4.0.0-rc.2

package/dist/cjs/Spinner/Spinner.js

@@ -1,79 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports.Spinner = Spinner;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _react2 = require("@emotion/react");
-
-var _Box = require("../Box");
-
-var _system = require("../system");
-
-var rotate = (0, _react2.keyframes)({
-  '100%': {
-    transform: 'rotate(360deg)'
-  }
-});
-var rotateCentered = (0, _react2.keyframes)({
-  '100%': {
-    transform: 'translate(-50%, -50%) rotate(360deg)'
-  }
-});
-
-function Spinner(_ref) {
-  var center = _ref.center,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size,
-      thickness = _ref.thickness,
-      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["center", "size", "thickness"]);
-
-  var _useThemeProps = (0, _system.useThemeProps)('spinner', props),
-      color = _useThemeProps.color,
-      sizes = _useThemeProps.sizes,
-      sizeThickness = _useThemeProps.thickness,
-      trackColor = _useThemeProps.trackColor,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_useThemeProps, ["color", "sizes", "thickness", "trackColor"]);
-
-  var boxProps = {
-    inline: true,
-    alignSelf: 'center',
-    verticalAlign: 'middle',
-    radius: 'circle',
-    borderColor: trackColor,
-    borderTopColor: color
-  };
-  var sizeValue = sizes[size] || size;
-  var thicknessValue = thickness || sizeThickness[size];
-  var boxSizeStyles = {
-    borderWidth: thicknessValue,
-    height: sizeValue,
-    width: sizeValue
-  };
-
-  if (process.env.NODE_ENV !== 'production') {
-    var width = typeof sizeValue === 'number' ? sizeValue * 8 : sizeValue.includes('px') ? parseInt(sizeValue) : null;
-    var spinnerRadius = width && width / 2;
-    if (spinnerRadius && thicknessValue > spinnerRadius) console.warn("The thickness value (" + thicknessValue + "px) of this spinner is larger than the radius (" + spinnerRadius + "px), this will distort the rendered size.");
-  }
-
-  if (center) {
-    boxProps.position = 'absolute';
-    boxProps.left = '50%';
-    boxProps.top = '50%';
-    boxProps.transform = 'translate(-50%, -50%) rotate(0deg)';
-    boxProps.animation = rotateCentered + " 500ms infinite linear";
-  } else {
-    boxProps.transform = 'rotate(0deg)';
-    boxProps.animation = rotate + " 500ms infinite linear";
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_Box.Box, (0, _extends2["default"])({}, boxProps, boxSizeStyles, restProps));
-}

package/dist/cjs/Spinner/index.js

@@ -1,15 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-var _exportNames = {};
-exports["default"] = void 0;
-
-var _Spinner = require("./Spinner");
-
-exports["default"] = _Spinner.Spinner;
-Object.keys(_Spinner).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Spinner[key]) return;
-  exports[key] = _Spinner[key];
-});

package/dist/cjs/StackView/StackView.js

@@ -1,106 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports.StackView = 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 = require("@emotion/react");
-
-var React = _interopRequireWildcard(require("react"));
-
-var _splitStyles = _interopRequireDefault(require("../system/split-styles"));
-
-var _system = require("../system");
-
-var _utils = require("../utils");
-
-var _VariantProvider = require("../VariantProvider");
-
-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; } /** @jsx jsx */
-
-var BASELINE = 'baseline';
-var CENTER = 'center';
-var END = 'end';
-var FILL = 'fill';
-var HORIZONTAL = 'horizontal';
-var SPACE_EVENLY = 'space-evenly';
-var SPACE_BETWEEN = 'space-between';
-var START = 'start';
-var STRETCH = 'stretch';
-var VERTICAL = 'vertical';
-var stackViewPlugin = {
-  styleProps: ['alignment', 'axis', 'distribution', 'spacing'],
-  getStyles: function getStyles(_ref) {
-    var inline = _ref.inline,
-        alignment = _ref.alignment,
-        axis = _ref.axis,
-        distribution = _ref.distribution,
-        spacing = _ref.spacing,
-        styles = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["inline", "alignment", "axis", "distribution", "spacing"]);
-
-    if (axis && styles.flexDirection === undefined) {
-      styles.flexDirection = axis === HORIZONTAL ? 'row' : 'column';
-    }
-
-    if (alignment && styles.alignItems === undefined) {
-      styles.alignItems = alignment;
-    }
-
-    if (distribution === FILL) {
-      styles['& > *'] = {
-        flex: '1 0 0px'
-      };
-    } else if (styles.justifyContent === undefined) {
-      styles.justifyContent = distribution;
-    }
-
-    if (typeof spacing === 'number' || typeof spacing === 'string') {
-      styles.gap = (0, _system.spacingValue)(spacing);
-    }
-
-    return styles;
-  }
-};
-var defaultElement = 'div';
-
-var StackView = function StackView(_ref2) {
-  var as = _ref2.as,
-      children = _ref2.children,
-      inline = _ref2.inline,
-      innerRef = _ref2.innerRef,
-      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref2, ["as", "children", "inline", "innerRef"]);
-  var variant = (0, _VariantProvider.useVariant)();
-  var Element = as || defaultElement;
-  var childrenToRender = Element === 'textarea' ? undefined : typeof props.spacing === 'object' ? (0, _utils.joinChildren)(children, props.spacing) : children;
-  return (0, _react.jsx)(Element, (0, _extends2["default"])({
-    ref: innerRef
-  }, (0, _splitStyles["default"])(_objectSpread({
-    display: inline ? 'inline-flex' : 'flex',
-    axis: VERTICAL,
-    plugin: stackViewPlugin,
-    variant: variant
-  }, props))), childrenToRender);
-};
-
-exports.StackView = StackView;
-StackView.BASELINE = BASELINE;
-StackView.CENTER = CENTER;
-StackView.END = END;
-StackView.FILL = FILL;
-StackView.HORIZONTAL = HORIZONTAL;
-StackView.SPACE_BETWEEN = SPACE_BETWEEN;
-StackView.SPACE_EVENLY = SPACE_EVENLY;
-StackView.START = START;
-StackView.STRETCH = STRETCH;
-StackView.VERTICAL = VERTICAL;

package/dist/cjs/StackView/index.js

@@ -1,15 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-var _exportNames = {};
-exports["default"] = void 0;
-
-var _StackView = require("./StackView");
-
-exports["default"] = _StackView.StackView;
-Object.keys(_StackView).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _StackView[key]) return;
-  exports[key] = _StackView[key];
-});

package/dist/cjs/StepperField/StepperField.js

@@ -1,84 +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 _Button = _interopRequireDefault(require("../Button"));
-
-var _system = require("../system");
-
-var _NumberField = _interopRequireDefault(require("../NumberField"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-var StepperField = function StepperField(_ref) {
-  var _ref$max = _ref.max,
-      max = _ref$max === void 0 ? Infinity : _ref$max,
-      _ref$min = _ref.min,
-      min = _ref$min === void 0 ? -Infinity : _ref$min,
-      onChange = _ref.onChange,
-      _ref$step = _ref.step,
-      step = _ref$step === void 0 ? 1 : _ref$step,
-      _ref$value = _ref.value,
-      value = _ref$value === void 0 ? 0 : _ref$value,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["max", "min", "onChange", "step", "value"]);
-
-  var _useThemeProps = (0, _system.useThemeProps)('stepperField', restProps),
-      _useThemeProps$size = _useThemeProps.size,
-      size = _useThemeProps$size === void 0 ? 'md' : _useThemeProps$size,
-      themeProps = (0, _objectWithoutPropertiesLoose2["default"])(_useThemeProps, ["size"]);
-
-  var boxSize = size;
-
-  var _useBoxSize = (0, _system.useBoxSize)(boxSize),
-      fontSize = _useBoxSize.fontSize,
-      navigateSize = _useBoxSize.navigateSize,
-      paddingHorizontal = _useBoxSize.paddingHorizontal;
-
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    axis: "horizontal",
-    fontSize: fontSize
-  }, themeProps), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-    disabled: value <= min,
-    icon: {
-      name: 'general.minus',
-      size: navigateSize(boxSize, -1)
-    },
-    onClick: function onClick() {
-      return onChange(Math.max(value - step, min));
-    },
-    size: boxSize,
-    title: "Decrement by " + step
-  }), /*#__PURE__*/_react["default"].createElement(_NumberField["default"], {
-    fontSize: "inherit",
-    max: max,
-    min: min,
-    onChange: onChange,
-    paddingHorizontal: paddingHorizontal,
-    size: boxSize,
-    step: step,
-    value: value
-  }), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-    disabled: value >= max,
-    icon: {
-      name: 'general.plus',
-      size: navigateSize(boxSize, -1)
-    },
-    onClick: function onClick() {
-      return onChange(Math.min(value + step, max));
-    },
-    size: boxSize,
-    title: "Increment by " + step
-  }));
-};
-
-var _default = StepperField;
-exports["default"] = _default;

package/dist/cjs/StepperField/index.js

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

package/dist/cjs/StepperProgress/Context.js

@@ -1,10 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _react = require("react");
-
-var StepperProgressContext = /*#__PURE__*/(0, _react.createContext)(null);
-var _default = StepperProgressContext;
-exports["default"] = _default;

package/dist/cjs/StepperProgress/Step.js

@@ -1,87 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _Box = _interopRequireDefault(require("../Box"));
-
-var _system = require("../system");
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-var _Context = _interopRequireDefault(require("./Context"));
-
-var CIRCLE_SIZE = 1.5;
-var BASE_COLOR = 'separatorSecondary';
-
-function Line() {
-  var _useContext = (0, _react.useContext)(_Context["default"]),
-      active = _useContext.active,
-      activeColor = _useContext.activeColor;
-
-  return /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    position: "absolute",
-    width: "100%",
-    height: "3px",
-    x: "calc(-100% + " + (0, _system.spacingValue)(CIRCLE_SIZE / 2) + ")",
-    y: "4.5px",
-    backgroundColor: BASE_COLOR,
-    zIndex: 0
-  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    width: "100%",
-    height: "100%",
-    backgroundColor: activeColor,
-    transformOrigin: "left center",
-    transition: "transform 280ms ease-out",
-    style: {
-      transform: "scaleX(" + (active ? 1 : 0)
-    }
-  }));
-}
-
-function Indicator(props) {
-  var context = (0, _react.useContext)(_Context["default"]);
-  var active = props.active === undefined ? context.active : props.active;
-  var activeColor = props.activeColor === undefined ? context.activeColor : props.activeColor;
-
-  var _useState = (0, _react.useState)('0ms'),
-      delay = _useState[0],
-      setDelay = _useState[1];
-
-  (0, _react.useLayoutEffect)(function () {
-    setDelay(active === true ? '0ms' : '280ms');
-  }, [active]);
-  return /*#__PURE__*/_react["default"].createElement(_Box["default"], null, context.includeLine && /*#__PURE__*/_react["default"].createElement(Line, null), /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    width: CIRCLE_SIZE,
-    height: CIRCLE_SIZE,
-    radius: "circle",
-    backgroundColor: active ? activeColor : BASE_COLOR,
-    position: "relative",
-    zIndex: 1,
-    transition: "background-color 280ms ease-out",
-    transitionDelay: delay
-  }));
-}
-
-function Step(_ref) {
-  var active = _ref.active,
-      activeColor = _ref.activeColor,
-      renderStart = _ref.renderStart,
-      renderEnd = _ref.renderEnd;
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], {
-    alignment: "center",
-    position: "relative"
-  }, renderStart, /*#__PURE__*/_react["default"].createElement(Indicator, {
-    active: active,
-    activeColor: activeColor
-  }), renderEnd);
-}
-
-var _default = Step;
-exports["default"] = _default;

package/dist/cjs/StepperProgress/StepperProgress.js

@@ -1,49 +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 _GridView = _interopRequireDefault(require("../GridView"));
-
-var _Context = _interopRequireDefault(require("./Context"));
-
-var _system = require("../system");
-
-function StepperProgress(_ref) {
-  var activeStepIndex = _ref.activeStepIndex,
-      children = _ref.children,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["activeStepIndex", "children"]);
-
-  var _useThemeProps = (0, _system.useThemeProps)('stepperProgress', restProps),
-      _useThemeProps$active = _useThemeProps.activeColor,
-      activeColor = _useThemeProps$active === void 0 ? 'primary-light' : _useThemeProps$active,
-      themeProps = (0, _objectWithoutPropertiesLoose2["default"])(_useThemeProps, ["activeColor"]);
-
-  return /*#__PURE__*/_react["default"].createElement(_GridView["default"], (0, _extends2["default"])({
-    autoFlow: "column",
-    autoColumns: "1fr",
-    alignment: "center"
-  }, themeProps), _react.Children.map(children, function (child, stepIndex) {
-    return /*#__PURE__*/_react["default"].createElement(_Context["default"].Provider, {
-      key: stepIndex,
-      value: {
-        activeColor: activeColor,
-        active: stepIndex <= activeStepIndex,
-        includeLine: stepIndex > 0
-      }
-    }, child);
-  }));
-}
-
-var _default = StepperProgress;
-exports["default"] = _default;

package/dist/cjs/StepperProgress/index.js

@@ -1,14 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _StepperProgress = _interopRequireDefault(require("./StepperProgress"));
-
-var _Step = _interopRequireDefault(require("./Step"));
-
-_StepperProgress["default"].Step = _Step["default"];
-var _default = _StepperProgress["default"];
-exports["default"] = _default;

package/dist/cjs/Summary/Summary.js

@@ -1,41 +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 _Box = _interopRequireDefault(require("../Box"));
-
-var _Heading = _interopRequireDefault(require("../Heading"));
-
-var _StackView = _interopRequireDefault(require("../StackView"));
-
-/**
- * Use for brief content that could have an accompanying image or title.
- */
-var Summary = function Summary(_ref) {
-  var children = _ref.children,
-      image = _ref.image,
-      title = _ref.title,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children", "image", "title"]);
-  return /*#__PURE__*/_react["default"].createElement(_StackView["default"], (0, _extends2["default"])({
-    alignment: "center",
-    padding: 2,
-    spacing: 2
-  }, restProps), image && /*#__PURE__*/_react["default"].createElement(_Box["default"], null, image), title && /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
-    level: 3
-  }, title), children && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
-    maxWidth: 40,
-    textAlign: "center"
-  }, children));
-};
-
-var _default = Summary;
-exports["default"] = _default;

package/dist/cjs/Summary/index.js

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

package/dist/cjs/Tab/Tab.js

@@ -1,77 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports.Tab = Tab;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _Text = _interopRequireDefault(require("../Text"));
-
-var boxSizes = {
-  xs: {
-    fontSize: 5,
-    padding: 0.5,
-    paddingHorizontal: 1
-  },
-  sm: {
-    fontSize: 4,
-    padding: 0.5,
-    paddingHorizontal: 1.5
-  },
-  md: {
-    fontSize: 4,
-    padding: 1,
-    paddingHorizontal: 2
-  },
-  lg: {
-    fontSize: 3,
-    padding: 1.5,
-    lineHeight: 2,
-    paddingHorizontal: 2
-  }
-};
-
-function Tab(_ref) {
-  var active = _ref.active,
-      disabled = _ref.disabled,
-      href = _ref.href,
-      _ref$color = _ref.color,
-      color = _ref$color === void 0 ? 'backgroundSecondary' : _ref$color,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size,
-      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["active", "disabled", "href", "color", "size"]);
-  var tabProps = {
-    as: active ? 'span' : href ? 'a' : 'button',
-    fontWeight: 400,
-    radiusTop: 4,
-    cursor: active ? 'default' : 'pointer',
-    transition: 'opacity 160ms ease-out',
-    backgroundColor: color,
-    disabled: disabled
-  };
-
-  if (!active) {
-    if (disabled) {
-      tabProps.opacity = 0.6;
-      tabProps.cursor = 'not-allowed';
-
-      if (href) {
-        tabProps['aria-disabled'] = true;
-      }
-    } else {
-      tabProps.href = href;
-      tabProps.opacity = 0.8;
-      tabProps.hover = {
-        opacity: 1
-      };
-    }
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_Text["default"], (0, _extends2["default"])({}, tabProps, boxSizes[size], props));
-}

package/dist/cjs/Tab/index.js

@@ -1,15 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-var _exportNames = {};
-exports["default"] = void 0;
-
-var _Tab = require("./Tab");
-
-exports["default"] = _Tab.Tab;
-Object.keys(_Tab).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Tab[key]) return;
-  exports[key] = _Tab[key];
-});