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

package/dist/esm/Tooltip/Tooltip.test.js

@@ -1,160 +0,0 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import React from 'react';
-import { act, render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import '@testing-library/jest-dom/extend-expect';
-import { Button, Link, StackView, Text, Tooltip, hooks } from '..';
-
-var _ref = /*#__PURE__*/React.createElement(Text, null, "Tooltip anchor");
-
-var _ref3 = /*#__PURE__*/React.createElement(Text, null, "Tooltip anchor");
-
-var _ref5 = /*#__PURE__*/React.createElement(Button, null, "Tooltip anchor");
-
-var _ref7 = /*#__PURE__*/React.createElement(Text, null, "Tooltip anchor");
-
-var _ref8 = /*#__PURE__*/React.createElement(Tooltip, {
-  title: "Test Text"
-}, /*#__PURE__*/React.createElement(Text, null, "Tooltip anchor"));
-
-describe('Tooltip', function () {
-  test('does not render string when closed', function () {
-    var string = 'Test Text';
-    render( /*#__PURE__*/React.createElement(Tooltip, {
-      title: string
-    }, _ref));
-    expect(screen.queryByText(string)).toBeNull();
-  });
-  test('renders string on hover', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-    var string, tooltip;
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            string = 'Test Text';
-            render( /*#__PURE__*/React.createElement(Tooltip, {
-              title: string
-            }, _ref3));
-            userEvent.hover(screen.getByText('Tooltip anchor'));
-            _context.next = 5;
-            return screen.findByText(string);
-
-          case 5:
-            tooltip = _context.sent;
-            expect(tooltip).toBeInTheDocument();
-
-          case 7:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  })));
-  test('renders string on focus', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-    var string, tooltip;
-    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            string = 'Test Text';
-            render( /*#__PURE__*/React.createElement(Tooltip, {
-              title: string,
-              triggerOnFocus: true
-            }, _ref5));
-            userEvent.tab();
-            _context2.next = 5;
-            return screen.findByText(string);
-
-          case 5:
-            tooltip = _context2.sent;
-            expect(tooltip).toBeInTheDocument();
-
-          case 7:
-          case "end":
-            return _context2.stop();
-        }
-      }
-    }, _callee2);
-  })));
-  test('removes string after timeout', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-    var string, anchor, tooltip;
-    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            string = 'Test Text';
-            render( /*#__PURE__*/React.createElement(Tooltip, {
-              title: string
-            }, _ref7));
-            anchor = screen.getByText('Tooltip anchor');
-            expect(screen.queryByText(string)).toBeNull();
-            userEvent.hover(anchor);
-            _context3.next = 7;
-            return screen.findByText(string);
-
-          case 7:
-            tooltip = _context3.sent;
-            expect(tooltip).toBeInTheDocument();
-            userEvent.unhover(anchor);
-            _context3.next = 12;
-            return waitFor(function () {
-              expect(screen.queryByText(string)).not.toBeInTheDocument();
-            });
-
-          case 12:
-          case "end":
-            return _context3.stop();
-        }
-      }
-    }, _callee3);
-  })));
-  test('stays open when hovering a custom tooltip', function () {
-    var CustomTooltip = function CustomTooltip() {
-      var _hooks$useHover = hooks.useHover(),
-          hover = _hooks$useHover.hover,
-          hoverProps = _hooks$useHover.hoverProps;
-
-      return /*#__PURE__*/React.createElement(Tooltip, {
-        title: /*#__PURE__*/React.createElement(Link, {
-          to: "#"
-        }, /*#__PURE__*/React.createElement(StackView, null, /*#__PURE__*/React.createElement(Text, {
-          "data-hover": hover
-        }, string)))
-      }, /*#__PURE__*/React.createElement(Button, hoverProps, "Tooltip anchor"));
-    };
-
-    var string = 'Test Text';
-    render( /*#__PURE__*/React.createElement(CustomTooltip, null));
-    var anchor = screen.getByText('Tooltip anchor');
-    userEvent.hover(anchor);
-    act(function () {
-      jest.runAllTimers();
-    });
-    var tooltip = screen.getByText(string);
-    expect(tooltip).toBeInTheDocument();
-    userEvent.unhover(anchor);
-    userEvent.hover(tooltip);
-    act(function () {
-      jest.runAllTimers();
-    });
-    expect(tooltip).toBeInTheDocument();
-    userEvent.unhover(tooltip);
-    act(function () {
-      jest.runAllTimers();
-    });
-    expect(tooltip).not.toBeInTheDocument();
-  });
-  test('cleans up pageViewChange listeners', function () {
-    window.removeEventListener = jest.fn().mockImplementation(function (event, callback) {});
-    document.removeEventListener = jest.fn().mockImplementation(function (event, callback) {});
-
-    var _render = render(_ref8),
-        unmount = _render.unmount;
-
-    unmount();
-    expect(window.removeEventListener).toBeCalledWith('focus', expect.any(Function));
-    expect(window.removeEventListener).toBeCalledWith('blur', expect.any(Function));
-    expect(document.removeEventListener).toBeCalledWith('visibilitychange', expect.any(Function));
-  });
-});

package/dist/esm/Tooltip/index.js

@@ -1,2 +0,0 @@
-import Tooltip from './Tooltip';
-export default Tooltip;

package/dist/esm/VariantProvider/VariantProvider.js

@@ -1,18 +0,0 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { createContext, useContext } from 'react';
-var VariantContext = /*#__PURE__*/createContext();
-export function useVariant() {
-  var variant = useContext(VariantContext);
-  return variant ? Object.keys(variant).filter(function (key) {
-    return variant[key];
-  }) : null;
-}
-export function VariantProvider(_ref) {
-  var children = _ref.children,
-      props = _objectWithoutPropertiesLoose(_ref, ["children"]);
-
-  var parentVariant = useVariant();
-  return /*#__PURE__*/React.createElement(VariantContext.Provider, {
-    value: props
-  }, children);
-}

package/dist/esm/VariantProvider/index.js

@@ -1 +0,0 @@
-export { VariantProvider as default, useVariant } from './VariantProvider';

package/dist/esm/Wizard/Step.js

@@ -1,23 +0,0 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import { useContext, useEffect } from 'react';
-import WizardContext from './WizardContext';
-
-function Step(_ref) {
-  var children = _ref.children,
-      name = _ref.name,
-      valid = _ref.valid;
-
-  var _useContext = useContext(WizardContext),
-      addStep = _useContext.addStep,
-      wizard = _objectWithoutPropertiesLoose(_useContext, ["addStep"]);
-
-  useEffect(function () {
-    return addStep({
-      name: name,
-      valid: valid
-    });
-  }, []);
-  return children(wizard);
-}
-
-export default Step;

package/dist/esm/Wizard/Wizard.js

@@ -1,170 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-
-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) { _defineProperty(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; }
-
-import React, { Children, useCallback, useReducer, useState } from 'react';
-import Button from '../Button';
-import Card from '../Card';
-import Divider from '../Divider';
-import StackView from '../StackView';
-import PagerView from '../PagerView';
-import StepperProgress from '../StepperProgress';
-import Text from '../Text';
-import { useThemeProps } from '../system';
-import WizardContext from './WizardContext';
-
-var _ref2 = /*#__PURE__*/React.createElement(Divider, null);
-
-function Wizard(props) {
-  var _useThemeProps = useThemeProps('wizard', props),
-      _useThemeProps$autoFo = _useThemeProps.autoFocus,
-      autoFocus = _useThemeProps$autoFo === void 0 ? true : _useThemeProps$autoFo,
-      backButtonProps = _useThemeProps.backButtonProps,
-      buttonProps = _useThemeProps.buttonProps,
-      cancelButtonProps = _useThemeProps.cancelButtonProps,
-      children = _useThemeProps.children,
-      footerProps = _useThemeProps.footerProps,
-      _useThemeProps$initia = _useThemeProps.initialPayload,
-      initialPayload = _useThemeProps$initia === void 0 ? {} : _useThemeProps$initia,
-      nextButtonProps = _useThemeProps.nextButtonProps,
-      _useThemeProps$nextBu = _useThemeProps.nextButtonTitle,
-      nextButtonTitle = _useThemeProps$nextBu === void 0 ? function (_ref) {
-    var activeStepIndex = _ref.activeStepIndex,
-        steps = _ref.steps,
-        totalSteps = _ref.totalSteps;
-    return activeStepIndex >= totalSteps - 1 ? 'Finish' : 'Next';
-  } : _useThemeProps$nextBu,
-      onCancel = _useThemeProps.onCancel,
-      onSubmit = _useThemeProps.onSubmit,
-      renderProgress = _useThemeProps.renderProgress,
-      restProps = _objectWithoutPropertiesLoose(_useThemeProps, ["autoFocus", "backButtonProps", "buttonProps", "cancelButtonProps", "children", "footerProps", "initialPayload", "nextButtonProps", "nextButtonTitle", "onCancel", "onSubmit", "renderProgress"]);
-
-  var _useState = useState(0),
-      activeStepIndex = _useState[0],
-      setActiveStepIndex = _useState[1];
-
-  var _useState2 = useState([]),
-      steps = _useState2[0],
-      setSteps = _useState2[1];
-
-  var _useState3 = useState(false),
-      sendingPayload = _useState3[0],
-      setSendingPayload = _useState3[1];
-
-  var totalSteps = steps.length;
-
-  var _useReducer = useReducer(function (prevState, updatedProperty) {
-    return _objectSpread(_objectSpread({}, prevState), updatedProperty);
-  }, initialPayload),
-      payload = _useReducer[0],
-      setPayload = _useReducer[1];
-
-  var addStep = useCallback(function (step) {
-    setSteps(function (steps) {
-      return [].concat(steps, [step]);
-    });
-    return function () {
-      setSteps(function (steps) {
-        return steps.filter(function (previousStep) {
-          return previousStep.name !== step.name;
-        });
-      });
-    };
-  }, [steps]);
-  var isCurrentStepValid = useCallback(function () {
-    var currentStep = steps[activeStepIndex];
-    return currentStep && currentStep.valid ? currentStep.valid(payload) : true;
-  }, [activeStepIndex, steps, payload]);
-  var handleSubmit = useCallback(function () {
-    if (onSubmit) {
-      var _complete = function _complete() {
-        return setSendingPayload(false);
-      };
-
-      setSendingPayload(true);
-      onSubmit(payload, _complete);
-    }
-  }, [payload]);
-  return /*#__PURE__*/React.createElement(WizardContext.Provider, {
-    value: {
-      activeStepIndex: activeStepIndex,
-      addStep: addStep,
-      setPayload: setPayload,
-      payload: payload,
-      totalSteps: totalSteps
-    }
-  }, /*#__PURE__*/React.createElement(StackView, _extends({
-    alignment: "center",
-    minWidth: 48,
-    maxWidth: 96
-  }, restProps), renderProgress ? renderProgress({
-    activeStepIndex: activeStepIndex,
-    steps: steps,
-    totalSteps: totalSteps
-  }) : /*#__PURE__*/React.createElement(StepperProgress, {
-    width: "80%",
-    paddingTop: 6,
-    paddingBottom: 4,
-    activeStepIndex: activeStepIndex
-  }, steps.map(function (step, index) {
-    return /*#__PURE__*/React.createElement(StepperProgress.Step, {
-      key: index,
-      renderEnd: /*#__PURE__*/React.createElement(Text, {
-        align: "center",
-        marginTop: 2
-      }, step.name)
-    });
-  })), /*#__PURE__*/React.createElement(Card, {
-    spacing: _ref2,
-    elevation: 1
-  }, /*#__PURE__*/React.createElement(PagerView, {
-    activeViewIndex: activeStepIndex,
-    autoFocus: autoFocus
-  }, Children.map(children, function (child, index) {
-    return /*#__PURE__*/React.createElement(PagerView.View, {
-      key: index
-    }, child);
-  })), /*#__PURE__*/React.createElement(StackView, _extends({
-    axis: "horizontal",
-    distribution: activeStepIndex > 0 ? 'space-between' : 'end',
-    padding: 1,
-    spacing: 1
-  }, footerProps), activeStepIndex === 0 && onCancel && /*#__PURE__*/React.createElement(Button, _extends({
-    disabled: sendingPayload,
-    onClick: onCancel,
-    size: "lg",
-    title: "Cancel",
-    variant: "naked"
-  }, buttonProps, cancelButtonProps)), activeStepIndex > 0 && /*#__PURE__*/React.createElement(Button, _extends({
-    disabled: sendingPayload,
-    iconLeft: {
-      name: 'general.leftChevron',
-      size: 'sm'
-    },
-    onClick: function onClick() {
-      return setActiveStepIndex(activeStepIndex - 1);
-    },
-    size: "lg",
-    title: "Back",
-    variant: "naked"
-  }, buttonProps, backButtonProps)), /*#__PURE__*/React.createElement(Button, _extends({
-    disabled: !isCurrentStepValid(),
-    onClick: function onClick() {
-      return activeStepIndex >= totalSteps - 1 ? handleSubmit() : setActiveStepIndex(activeStepIndex + 1);
-    },
-    size: "lg",
-    spinner: sendingPayload,
-    theme: "primary",
-    title: nextButtonTitle({
-      activeStepIndex: activeStepIndex,
-      steps: steps,
-      totalSteps: totalSteps
-    })
-  }, buttonProps, nextButtonProps))))));
-}
-
-export default Wizard;

package/dist/esm/Wizard/WizardContext.js

@@ -1,3 +0,0 @@
-import { createContext } from 'react';
-var WizardContext = /*#__PURE__*/createContext();
-export default WizardContext;

package/dist/esm/Wizard/index.js

@@ -1,4 +0,0 @@
-import Wizard from './Wizard';
-import Step from './Step';
-Wizard.Step = Step;
-export default Wizard;

package/dist/esm/WrapView/WrapView.js

@@ -1,26 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import StackView from '../StackView';
-import { spacingValue } from '../system';
-export function WrapView(_ref) {
-  var children = _ref.children,
-      spacing = _ref.spacing,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "spacing"]);
-
-  var styles = {
-    basis: '100%'
-  };
-
-  if (spacing) {
-    styles.gap = spacingValue(spacing);
-  }
-
-  return /*#__PURE__*/React.createElement(StackView, _extends({
-    axis: "horizontal"
-  }, restProps), /*#__PURE__*/React.createElement(StackView, {
-    wrap: true,
-    axis: "horizontal",
-    css: styles
-  }, children));
-}

package/dist/esm/WrapView/index.js

@@ -1,2 +0,0 @@
-export * from './WrapView';
-export { WrapView as default } from './WrapView';

package/dist/esm/hooks/index.js

@@ -1,7 +0,0 @@
-export { useDocumentEvent } from './use-document-event';
-export { useFocus } from './use-focus';
-export { useHover } from './use-hover';
-export { useId } from './use-id';
-export { useKeyboardShortcuts } from './use-keyboard-shortcuts';
-export { useRovingIndex } from './use-roving-index';
-export { useMeasure } from './use-measure';

package/dist/esm/hooks/use-accessibility-violation.js

@@ -1,69 +0,0 @@
-import * as React from 'react';
-import Icon from '../Icon';
-import StackView from '../StackView';
-import Text from '../Text';
-/**
- * Provide an on-screen and optional console accessibilty violation.
- */
-
-var _ref = /*#__PURE__*/React.createElement(StackView, {
-  axis: "horizontal",
-  alignment: "center",
-  spacing: 1
-}, /*#__PURE__*/React.createElement(Icon, {
-  name: "general.exclamationCircle",
-  size: "md",
-  color: "error"
-}), /*#__PURE__*/React.createElement(Text, {
-  fontSize: 3,
-  weight: 500
-}, "Accessibility Violation"));
-
-export function useAccessibilityViolation(
-/** Content to be displayed in tooltip when hovering element. */
-tooltipContent,
-/** Content to be displayed in the console with a reference to the element. */
-consoleContent) {
-  if (process.env.NODE_ENV === 'production') {
-    return {};
-  } else {
-    var wrapperRef = React.useRef(null);
-    var tooltipProps = {
-      title: /*#__PURE__*/React.createElement(StackView, {
-        width: 32,
-        spacing: 1,
-        cursor: "default"
-      }, _ref, /*#__PURE__*/React.createElement(Text, {
-        fontSize: 3,
-        lineHeight: 3
-      }, tooltipContent)),
-      openDelay: 0,
-      closeDelay: 300,
-      popoverProps: {
-        textAlign: 'left',
-        paddingHorizontal: 2,
-        paddingVertical: 2,
-        backgroundColor: 'surface',
-        color: 'foreground',
-        stroke: 'separator',
-        strokeWeight: 1,
-        elevation: 2
-      }
-    };
-    var wrapperProps = {
-      innerRef: wrapperRef,
-      stroke: 'error',
-      strokeAlign: 'outside',
-      strokeWeight: 4
-    };
-    React.useEffect(function () {
-      if (wrapperRef.current) {
-        console.error(consoleContent, wrapperRef.current);
-      }
-    }, []);
-    return {
-      tooltipProps: tooltipProps,
-      wrapperProps: wrapperProps
-    };
-  }
-}

package/dist/esm/hooks/use-document-event.js

@@ -1,33 +0,0 @@
-import { useEffect, useRef } from 'react';
-/**
- * Provide a callback for any document event type.
- *
- * @event {string} type - A valid [DOM event](https://developer.mozilla.org/en-US/docs/Web/Events).
- * @param {Function} callback - Callback when specified event type occurs.
- *
- * @example
- *
- * function App() {
- *   useDocumentEvent('keydown', event => {
- *     console.log(`${event.key} pressed`)
- *   })
- *   return <div>App</div>
- * }
- */
-
-export function useDocumentEvent(type, callback) {
-  var savedCallback = useRef(callback);
-  useEffect(function () {
-    savedCallback.current = callback;
-  }, [callback]);
-  useEffect(function () {
-    function handleEvent(event) {
-      savedCallback.current(event);
-    }
-
-    document.addEventListener(type, handleEvent);
-    return function () {
-      document.removeEventListener(type, handleEvent);
-    };
-  }, []);
-}

package/dist/esm/hooks/use-focus.js

@@ -1,24 +0,0 @@
-import { useState } from 'react';
-/**
- * Determines when one or many elements take focus.
- *
- * @returns {{ focus: boolean, focusProps: Object }}
- */
-
-export function useFocus() {
-  var _useState = useState(false),
-      focus = _useState[0],
-      setFocus = _useState[1];
-
-  return {
-    focus: focus,
-    focusProps: {
-      onFocus: function onFocus() {
-        return setFocus(true);
-      },
-      onBlur: function onBlur() {
-        return setFocus(false);
-      }
-    }
-  };
-}

package/dist/esm/hooks/use-hover.js

@@ -1,18 +0,0 @@
-import { useState } from 'react';
-export function useHover() {
-  var _useState = useState(false),
-      hover = _useState[0],
-      setHover = _useState[1];
-
-  return {
-    hover: hover,
-    hoverProps: {
-      onMouseEnter: function onMouseEnter() {
-        return setHover(true);
-      },
-      onMouseLeave: function onMouseLeave() {
-        return setHover(false);
-      }
-    }
-  };
-}

package/dist/esm/hooks/use-id.js

@@ -1,20 +0,0 @@
-// this will eventually be replaced with useOpaqueIdentifier once it is stable:
-// https://github.com/facebook/react/pull/17322
-import { useRef } from 'react';
-var idCounter = 1;
-/**
- * Generates a unique id based on the provided prefix.
- * Be aware using the same prefix elsewhere _does not_ generate a unique id.
- * @param {string} prefix
- * @returns {string} unique prefixed id
- */
-
-export function useId(prefix) {
-  var id = useRef(null);
-
-  if (id.current === null) {
-    id.current = prefix + "-" + idCounter++;
-  }
-
-  return id.current;
-}

package/dist/esm/hooks/use-keyboard-shortcuts.js

@@ -1,29 +0,0 @@
-import { useEffect } from 'react';
-import Mousetrap from 'mousetrap';
-export function useKeyboardShortcuts(keyboardShortcuts, data) {
-  function bindKeyboardShortcuts() {
-    if (keyboardShortcuts) {
-      Object.keys(keyboardShortcuts).forEach(function (key) {
-        return Mousetrap.bind(key, keyboardShortcuts[key].bind(null, data));
-      });
-    }
-  }
-
-  function unbindKeyboardShortcuts() {
-    if (keyboardShortcuts) {
-      Object.keys(keyboardShortcuts).forEach(function (key) {
-        return Mousetrap.unbind(key);
-      });
-    }
-  }
-
-  useEffect(function () {
-    return function () {
-      unbindKeyboardShortcuts();
-    };
-  }, []);
-  return {
-    bindKeyboardShortcuts: bindKeyboardShortcuts,
-    unbindKeyboardShortcuts: unbindKeyboardShortcuts
-  };
-}