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

package/dist/cjs/TimeField/TimeField.test.js

@@ -1,442 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-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 _react = _interopRequireWildcard(require("react"));
-
-var _react2 = require("@testing-library/react");
-
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-
-require("@testing-library/jest-dom/extend-expect");
-
-var _TimeField = _interopRequireDefault(require("./TimeField"));
-
-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; }
-
-var TestApp = function TestApp(_ref) {
-  var initialValue = _ref.value,
-      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["value"]);
-
-  var _useState = (0, _react.useState)(initialValue),
-      value = _useState[0],
-      setValue = _useState[1];
-
-  return /*#__PURE__*/_react["default"].createElement(_TimeField["default"], (0, _extends2["default"])({}, props, {
-    value: value,
-    onChange: setValue
-  }));
-};
-
-var setup = function setup(_ref2) {
-  var hours = _ref2.hours,
-      minutes = _ref2.minutes,
-      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref2, ["hours", "minutes"]);
-  var testApp = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(TestApp, (0, _extends2["default"])({}, props, {
-    value: [hours, minutes]
-  })));
-  var hourInput = testApp.queryByLabelText('Hours');
-  var minuteInput = testApp.queryByLabelText('Minutes');
-  var meridiemInput = testApp.queryByLabelText('AM/PM');
-  return _objectSpread({
-    hourInput: hourInput,
-    minuteInput: minuteInput,
-    meridiemInput: meridiemInput
-  }, testApp);
-}; // 0 padding
-
-
-it('left pads 0 for single digit hours', function () {
-  var _setup = setup({
-    hours: 1
-  }),
-      hourInput = _setup.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-});
-it('doesnt pad double digit hours', function () {
-  var _setup2 = setup({
-    hours: 11
-  }),
-      hourInput = _setup2.hourInput;
-
-  expect(hourInput).toHaveValue('11');
-});
-it('left pads 0 for single digit minutes', function () {
-  var _setup3 = setup({
-    minutes: 3
-  }),
-      minuteInput = _setup3.minuteInput;
-
-  expect(minuteInput).toHaveValue('03');
-});
-it('doesnt pad double digit minutes', function () {
-  var _setup4 = setup({
-    minutes: 35
-  }),
-      minuteInput = _setup4.minuteInput;
-
-  expect(minuteInput).toHaveValue('35');
-}); // hour display
-
-it('displays 13 hours as 01 hours for 12 hour clock', function () {
-  var _setup5 = setup({
-    hours: 13
-  }),
-      hourInput = _setup5.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-});
-it('displays 0 hours as 12 hours for 12 hour clock', function () {
-  var _setup6 = setup({
-    hours: 13
-  }),
-      hourInput = _setup6.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-});
-it('displays 13 hours as 13 hours for 24 hour clock', function () {
-  var _setup7 = setup({
-    hours: 13,
-    twelveHourClock: false
-  }),
-      hourInput = _setup7.hourInput;
-
-  expect(hourInput).toHaveValue('13');
-}); // meridiem
-
-it('displays the meridiem for 12 hour clock', function () {
-  var _setup8 = setup({
-    hours: 13
-  }),
-      meridiemInput = _setup8.meridiemInput;
-
-  expect(meridiemInput).toHaveValue('PM');
-});
-it('does not display the meridiem for 24 hour clock', function () {
-  var _setup9 = setup({
-    hours: 13,
-    twelveHourClock: false
-  }),
-      meridiemInput = _setup9.meridiemInput;
-
-  expect(meridiemInput).not.toBeInTheDocument();
-}); // arrow key events
-
-it('changes focus to minutes from hours on arrow right', function () {
-  var _setup10 = setup({
-    hours: 1,
-    minutes: 30
-  }),
-      hourInput = _setup10.hourInput,
-      minuteInput = _setup10.minuteInput;
-
-  _userEvent["default"].type(hourInput, '{arrowright}');
-
-  expect(minuteInput).toHaveFocus();
-});
-it('changes focus to hours from minutes on arrow left', function () {
-  var _setup11 = setup({
-    hours: 1,
-    minutes: 30
-  }),
-      hourInput = _setup11.hourInput,
-      minuteInput = _setup11.minuteInput;
-
-  _userEvent["default"].type(minuteInput, '{arrowleft}');
-
-  expect(hourInput).toHaveFocus();
-});
-it('changes focus to meridiem from minutes on arrow right for 12 hour clock', function () {
-  var _setup12 = setup({
-    hours: 1,
-    minutes: 30
-  }),
-      minuteInput = _setup12.minuteInput,
-      meridiemInput = _setup12.meridiemInput;
-
-  _userEvent["default"].type(minuteInput, '{arrowright}');
-
-  expect(meridiemInput).toHaveFocus();
-});
-it('changes the meridiem on arrow key', function () {
-  var _setup13 = setup({
-    hours: 13,
-    minutes: 42
-  }),
-      meridiemInput = _setup13.meridiemInput;
-
-  expect(meridiemInput).toHaveValue('PM');
-
-  _userEvent["default"].type(meridiemInput, '{arrowdown}');
-
-  expect(meridiemInput).toHaveValue('AM');
-
-  _userEvent["default"].type(meridiemInput, '{arrowup}');
-
-  expect(meridiemInput).toHaveValue('PM');
-});
-it('does not change the meridiem on arrow key if arrow keys are ignored', function () {
-  var _setup14 = setup({
-    hours: 13,
-    minutes: 42,
-    ignoredKeys: ['ArrowUp', 'ArrowDown']
-  }),
-      meridiemInput = _setup14.meridiemInput;
-
-  expect(meridiemInput).toHaveValue('PM');
-
-  _userEvent["default"].type(meridiemInput, '{arrowdown}');
-
-  expect(meridiemInput).toHaveValue('PM');
-
-  _userEvent["default"].type(meridiemInput, '{arrowup}');
-
-  expect(meridiemInput).toHaveValue('PM');
-});
-it('increment hour on arrow up', function () {
-  var _setup15 = setup({
-    hours: 1,
-    minutes: 42
-  }),
-      hourInput = _setup15.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-
-  _userEvent["default"].type(hourInput, '{arrowup}');
-
-  expect(hourInput).toHaveValue('02');
-});
-it('increment hour if arrow up on minutes exceeds max value', function () {
-  var _setup16 = setup({
-    hours: 1,
-    minutes: 59
-  }),
-      hourInput = _setup16.hourInput,
-      minuteInput = _setup16.minuteInput;
-
-  expect(hourInput).toHaveValue('01');
-
-  _userEvent["default"].type(minuteInput, '{arrowup}');
-
-  expect(hourInput).toHaveValue('02');
-});
-it('decrement hour on arrow down', function () {
-  var _setup17 = setup({
-    hours: 2,
-    minutes: 42
-  }),
-      hourInput = _setup17.hourInput;
-
-  expect(hourInput).toHaveValue('02');
-
-  _userEvent["default"].type(hourInput, '{arrowdown}');
-
-  expect(hourInput).toHaveValue('01');
-});
-it('decrement hour if arrow down on minutes exceeds min value', function () {
-  var _setup18 = setup({
-    hours: 2,
-    minutes: 0
-  }),
-      hourInput = _setup18.hourInput,
-      minuteInput = _setup18.minuteInput;
-
-  expect(hourInput).toHaveValue('02');
-
-  _userEvent["default"].type(minuteInput, '{arrowdown}');
-
-  expect(hourInput).toHaveValue('01');
-});
-it('increment minute on arrow up', function () {
-  var _setup19 = setup({
-    hours: 1,
-    minutes: 42
-  }),
-      minuteInput = _setup19.minuteInput;
-
-  expect(minuteInput).toHaveValue('42');
-
-  _userEvent["default"].type(minuteInput, '{arrowup}');
-
-  expect(minuteInput).toHaveValue('43');
-});
-it('decrement minute on arrow down', function () {
-  var _setup20 = setup({
-    hours: 2,
-    minutes: 43
-  }),
-      minuteInput = _setup20.minuteInput;
-
-  expect(minuteInput).toHaveValue('43');
-
-  _userEvent["default"].type(minuteInput, '{arrowdown}');
-
-  expect(minuteInput).toHaveValue('42');
-});
-it('set minute to min value if arrow up on minutes exceeds max value', function () {
-  var _setup21 = setup({
-    hours: 1,
-    minutes: 59
-  }),
-      minuteInput = _setup21.minuteInput;
-
-  expect(minuteInput).toHaveValue('59');
-
-  _userEvent["default"].type(minuteInput, '{arrowup}');
-
-  expect(minuteInput).toHaveValue('00');
-});
-it('set minute to max value if arrow down on minutes exceeds min value', function () {
-  var _setup22 = setup({
-    hours: 1,
-    minutes: 0
-  }),
-      minuteInput = _setup22.minuteInput;
-
-  expect(minuteInput).toHaveValue('00');
-
-  _userEvent["default"].type(minuteInput, '{arrowdown}');
-
-  expect(minuteInput).toHaveValue('59');
-});
-it('toggle meridiem if arrow up on hour exceeds eleven', function () {
-  var _setup23 = setup({
-    hours: 11
-  }),
-      hourInput = _setup23.hourInput,
-      meridiemInput = _setup23.meridiemInput;
-
-  expect(meridiemInput).toHaveValue('AM');
-
-  _userEvent["default"].type(hourInput, '{arrowup}');
-
-  expect(meridiemInput).toHaveValue('PM');
-});
-it('toggle meridiem if arrow down on hour exceeds min value', function () {
-  var _setup24 = setup({
-    hours: 0
-  }),
-      hourInput = _setup24.hourInput,
-      meridiemInput = _setup24.meridiemInput;
-
-  expect(meridiemInput).toHaveValue('AM');
-
-  _userEvent["default"].type(hourInput, '{arrowdown}');
-
-  expect(meridiemInput).toHaveValue('PM');
-});
-it('set 12 hour clock to min value if arrow up on hour exceeds max value', function () {
-  var _setup25 = setup({
-    hours: 12
-  }),
-      hourInput = _setup25.hourInput;
-
-  expect(hourInput).toHaveValue('12');
-
-  _userEvent["default"].type(hourInput, '{arrowup}');
-
-  expect(hourInput).toHaveValue('01');
-});
-it('set 24 hour clock to min value if arrow up on hour exceeds max value', function () {
-  var _setup26 = setup({
-    hours: 23,
-    twelveHourClock: false
-  }),
-      hourInput = _setup26.hourInput;
-
-  expect(hourInput).toHaveValue('23');
-
-  _userEvent["default"].type(hourInput, '{arrowup}');
-
-  expect(hourInput).toHaveValue('00');
-});
-it('set 12 hour clock to max value if arrow down on hour exceeds min value', function () {
-  var _setup27 = setup({
-    hours: 1
-  }),
-      hourInput = _setup27.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-
-  _userEvent["default"].type(hourInput, '{arrowdown}');
-
-  expect(hourInput).toHaveValue('12');
-});
-it('set 24 hour clock to max value if arrow down on hour exceeds min value', function () {
-  var _setup28 = setup({
-    hours: 0,
-    twelveHourClock: false
-  }),
-      hourInput = _setup28.hourInput;
-
-  expect(hourInput).toHaveValue('00');
-
-  _userEvent["default"].type(hourInput, '{arrowdown}');
-
-  expect(hourInput).toHaveValue('23');
-});
-it('does not change the value of hours on arrow up or arrow down if ignored', function () {
-  var _setup29 = setup({
-    hours: 1,
-    minutes: 42,
-    ignoredKeys: ['ArrowUp', 'ArrowDown']
-  }),
-      hourInput = _setup29.hourInput;
-
-  expect(hourInput).toHaveValue('01');
-
-  _userEvent["default"].type(hourInput, '{arrowup}');
-
-  expect(hourInput).toHaveValue('01');
-
-  _userEvent["default"].type(hourInput, '{arrowdown}');
-
-  expect(hourInput).toHaveValue('01');
-});
-it('does not change the value of minutes on arrow up or arrow down if ignored', function () {
-  var _setup30 = setup({
-    hours: 1,
-    minutes: 42,
-    ignoredKeys: ['ArrowUp', 'ArrowDown']
-  }),
-      minuteInput = _setup30.minuteInput;
-
-  expect(minuteInput).toHaveValue('42');
-
-  _userEvent["default"].type(minuteInput, '{arrowup}');
-
-  expect(minuteInput).toHaveValue('42');
-
-  _userEvent["default"].type(minuteInput, '{arrowdown}');
-
-  expect(minuteInput).toHaveValue('42');
-}); // ios
-
-it('renders iOS as a single input', function () {
-  var _setup31 = setup({
-    isIOS: true,
-    hours: 13,
-    minutes: 42
-  }),
-      container = _setup31.container,
-      hourInput = _setup31.hourInput,
-      minuteInput = _setup31.minuteInput,
-      meridiemInput = _setup31.meridiemInput;
-
-  var singleTimeInput = container.querySelector('[type=time]');
-  expect(singleTimeInput).toHaveValue('13:42');
-  expect(hourInput).not.toBeInTheDocument();
-  expect(minuteInput).not.toBeInTheDocument();
-  expect(meridiemInput).not.toBeInTheDocument();
-});

package/dist/cjs/TimeField/index.js

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

package/dist/cjs/TimeField/utils.js

@@ -1,61 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.addHoursToTime = addHoursToTime;
-exports.addMinutesToTime = addMinutesToTime;
-exports.addTimeToDate = addTimeToDate;
-exports.getMeridiem = getMeridiem;
-exports.getTimeFromDate = getTimeFromDate;
-exports.modulo = modulo;
-exports.MINUTES_IN_HOUR = exports.HOURS_TO_NOON = exports.HOURS_IN_DAY = void 0;
-
-var _dateFns = require("date-fns");
-
-var HOURS_IN_DAY = 24;
-exports.HOURS_IN_DAY = HOURS_IN_DAY;
-var HOURS_TO_NOON = HOURS_IN_DAY / 2;
-exports.HOURS_TO_NOON = HOURS_TO_NOON;
-var MINUTES_IN_HOUR = 60;
-exports.MINUTES_IN_HOUR = MINUTES_IN_HOUR;
-
-function addHoursToTime(time, hoursToAdd) {
-  var hours = time[0],
-      minutes = time[1];
-  return [modulo(hours + hoursToAdd, HOURS_IN_DAY), minutes];
-}
-
-function addMinutesToTime(time, minutesToAdd) {
-  var hours = time[0],
-      minutes = time[1];
-  var nextMinutes = minutes + minutesToAdd;
-  var remainderMinutes = modulo(nextMinutes, MINUTES_IN_HOUR);
-
-  if (remainderMinutes >= 0) {
-    var nextHours = hours + Math.floor(nextMinutes / MINUTES_IN_HOUR);
-    hours = modulo(nextHours, HOURS_IN_DAY);
-    minutes = remainderMinutes;
-  } else {
-    minutes = nextMinutes;
-  }
-
-  return [hours, minutes];
-}
-
-function addTimeToDate(date, time) {
-  var hours = time[0],
-      minutes = time[1];
-  return (0, _dateFns.addHours)((0, _dateFns.addMinutes)(date, minutes), hours);
-}
-
-function getMeridiem(time) {
-  var hours = time[0];
-  return hours <= 11 ? 'AM' : 'PM';
-}
-
-function getTimeFromDate(date) {
-  return [(0, _dateFns.getHours)(date), (0, _dateFns.getMinutes)(date)];
-}
-
-function modulo(n, m) {
-  return (n % m + m) % m;
-}

package/dist/cjs/ToggleSwitch/ToggleSwitch.js

@@ -1,102 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-exports.__esModule = true;
-exports.ToggleSwitch = ToggleSwitch;
-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 = require("../Box");
-
-var _colors = require("../system/colors");
-
-var _StackView = require("../StackView");
-
-var _Text = _interopRequireDefault(require("../Text"));
-
-var _Tooltip = _interopRequireDefault(require("../Tooltip"));
-
-var _system = require("../system");
-
-function ToggleSwitch(props) {
-  var _props$disabled = props.disabled,
-      disabled = _props$disabled === void 0 ? false : _props$disabled,
-      isChecked = props.isChecked,
-      label = props.label,
-      onClick = props.onClick,
-      _props$size = props.size,
-      size = _props$size === void 0 ? 'md' : _props$size,
-      tooltip = props.tooltip,
-      restProps = (0, _objectWithoutPropertiesLoose2["default"])(props, ["disabled", "isChecked", "label", "onClick", "size", "tooltip"]);
-
-  var _useThemeProps = (0, _system.useThemeProps)('toggleSwitch', restProps),
-      backgroundColor = _useThemeProps.backgroundColor;
-
-  var toggleButtonProps = {
-    height: 2.5,
-    width: 4.375
-  };
-  var toggleNotchProps = {
-    height: 2,
-    width: 2
-  };
-
-  if (size === 'sm') {
-    toggleButtonProps = {
-      height: 2.25,
-      width: 4
-    };
-    toggleNotchProps = {
-      height: 1.75,
-      width: 1.75
-    };
-  } else if (size === 'xs') {
-    toggleButtonProps = {
-      height: 2,
-      width: 3.5
-    };
-    toggleNotchProps = {
-      height: 1.5,
-      width: 1.5
-    };
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_Tooltip["default"], {
-    title: tooltip
-  }, /*#__PURE__*/_react["default"].createElement(_StackView.StackView, {
-    alignment: "center",
-    "aria-checked": isChecked ? 'true' : 'false',
-    as: "button",
-    axis: "horizontal",
-    cursor: disabled ? 'not-allowed' : 'pointer',
-    onClick: disabled ? undefined : onClick,
-    radius: "pill",
-    role: "switch",
-    spacing: size === 'xs' ? 0.5 : size === 'sm' ? 0.75 : 1,
-    disabled: disabled
-  }, /*#__PURE__*/_react["default"].createElement(_Box.Box, (0, _extends2["default"])({
-    backgroundColor: disabled ? _colors.colors.grays.light.neutral81 : isChecked ? backgroundColor : _colors.colors.grays.light.neutral62,
-    position: "relative",
-    radius: "pill"
-  }, toggleButtonProps), /*#__PURE__*/_react["default"].createElement(_Box.Box, (0, _extends2["default"])({
-    background: "#fff",
-    left: 0.25,
-    pointerEvents: "none",
-    position: "absolute",
-    radius: "circle",
-    top: 0.25,
-    transform: "translateX(" + (isChecked ? 'calc(100% - 1px)' : '0%') + ")",
-    transition: "120ms"
-  }, toggleNotchProps))), label && /*#__PURE__*/_react["default"].createElement(_Text["default"], {
-    size: size === 'xs' ? 5 : size === 'sm' ? 4 : 3
-  }, label)));
-}
-
-var _default = ToggleSwitch;
-exports["default"] = _default;