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

package/dist/esm/Modal/Modal.test.js

@@ -1,122 +0,0 @@
-import React, { useState } from 'react';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import '@testing-library/jest-dom/extend-expect';
-import Dropdown from '../Dropdown';
-import Select from '../Select';
-import { Button, Heading, Modal, ThemeProvider } from '../';
-import noop from 'lodash/noop';
-
-var _ref = /*#__PURE__*/React.createElement(Heading, {
-  "data-testid": "modal-header"
-}, "Hello");
-
-describe('Modal', function () {
-  var TestModal = function TestModal() {
-    var _useState = useState(false),
-        open = _useState[0],
-        setOpen = _useState[1];
-
-    return /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
-      "data-testid": "modal-toggle",
-      onClick: function onClick() {
-        return setOpen(!open);
-      },
-      title: "Toggle modal"
-    }), /*#__PURE__*/React.createElement(Modal, {
-      open: open,
-      onRequestClose: function onRequestClose() {
-        return setOpen(false);
-      }
-    }, _ref, /*#__PURE__*/React.createElement(Dropdown, null, [1, 2, 3].map(function (n) {
-      return /*#__PURE__*/React.createElement(Dropdown.Item, {
-        "data-testid": "dropdown-item-" + n,
-        key: n
-      }, n);
-    })), /*#__PURE__*/React.createElement(Select, {
-      onChange: noop
-    }, [1, 2, 3].map(function (n) {
-      return /*#__PURE__*/React.createElement(Select.Option, {
-        "data-testid": "select-option-" + n,
-        key: n,
-        value: n
-      }, n);
-    })))));
-  };
-
-  var _ref2 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  var _ref3 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  var _ref4 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  var _ref5 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  var _ref6 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  var _ref7 = /*#__PURE__*/React.createElement(TestModal, null);
-
-  describe('Keyboard navigation', function () {
-    it('should close modal on escape keypress (dropdown button has focus)', function () {
-      render(_ref2);
-      expect(screen.queryByTestId('modal-header')).toBeNull();
-      userEvent.click(screen.getByTestId('modal-toggle'));
-      expect(screen.getByTestId('modal-header')).toBeInTheDocument();
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('modal-header')).toBeNull();
-    });
-    it('should not close modal when escape key closes a dropdown within modal', function () {
-      render(_ref3);
-      userEvent.click(screen.getByTestId('modal-toggle'));
-
-      var _screen$getAllByRole = screen.getAllByRole('button'),
-          dropdown = _screen$getAllByRole[1];
-
-      expect(dropdown).toHaveFocus();
-      userEvent.keyboard('{arrowdown}');
-      userEvent.keyboard("{esc}");
-      expect(screen.getByTestId('modal-header')).toBeInTheDocument();
-    });
-    it('should close dropdown on escape & close modal on subsequent escape', function () {
-      render(_ref4);
-      userEvent.click(screen.getByTestId('modal-toggle'));
-      userEvent.keyboard('{arrowdown}');
-      userEvent.keyboard("{esc}");
-      expect(screen.getByTestId('modal-header')).toBeInTheDocument();
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('modal-header')).toBeNull();
-    });
-    it('should hide select popover on escape, but select remains in dom', function () {
-      render(_ref5);
-      userEvent.click(screen.getByTestId('modal-toggle'));
-      userEvent.tab();
-      userEvent.keyboard('{arrowdown}');
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('select-option-1')).toBeInTheDocument();
-    });
-    it('should hide select popover on escape, close (unmount) select popover on subsequent escape, persist modal', function () {
-      render(_ref6);
-      userEvent.click(screen.getByTestId('modal-toggle'));
-      userEvent.tab();
-      userEvent.keyboard('{arrowdown}');
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('select-option-1')).toBeInTheDocument();
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('select-option-1')).toBeNull();
-      expect(screen.queryByTestId('modal-header')).toBeInTheDocument();
-    });
-    it('should hide select popover on escape, close (unmount) select popover on subsequent escape, close modal on subsequent escape', function () {
-      render(_ref7);
-      userEvent.click(screen.getByTestId('modal-toggle'));
-      userEvent.tab();
-      userEvent.keyboard('{arrowdown}');
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('select-option-1')).toBeInTheDocument();
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('select-option-1')).toBeNull();
-      expect(screen.queryByTestId('modal-header')).toBeInTheDocument();
-      userEvent.keyboard("{esc}");
-      expect(screen.queryByTestId('modal-header')).toBeNull();
-    });
-  });
-});

package/dist/esm/Modal/index.js

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

package/dist/esm/NumberField/NumberField.js

@@ -1,250 +0,0 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
-import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-
-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 { createElement, Component } from 'react';
-import InputField from '../Input/InputField';
-import { padNumber, getTabbableSiblings } from '../utils';
-var MIN_VALUE = -Infinity;
-var MAX_VALUE = Infinity;
-var ACCEPTED_KEYS = ['Backspace', 'Delete', 'Tab', 'Enter', 'Home', 'End', 'ArrowLeft', 'ArrowRight', '-', '.'];
-
-function getPadStringSize(pad) {
-  var str = '';
-
-  for (var i = 0; i < pad; i++) {
-    str += '0';
-  }
-
-  return str;
-}
-
-function isNotAcceptedNumberKey(event) {
-  return !event.metaKey && event.key !== 'v' && isNaN(parseInt(event.key, 10)) && ACCEPTED_KEYS.indexOf(event.key) === -1;
-}
-
-var NumberField = /*#__PURE__*/function (_Component) {
-  _inheritsLoose(NumberField, _Component);
-
-  function NumberField() {
-    var _this;
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
-
-    _defineProperty(_assertThisInitialized(_this), "firstTouch", true);
-
-    _defineProperty(_assertThisInitialized(_this), "getParsedValues", function (value) {
-      return {
-        value: Number.parseFloat(value),
-        minValue: Number.parseFloat(_this.props.min),
-        maxValue: Number.parseFloat(_this.props.max)
-      };
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "clampValue", function (valueToCheck) {
-      var _this$getParsedValues = _this.getParsedValues(valueToCheck),
-          value = _this$getParsedValues.value,
-          minValue = _this$getParsedValues.minValue;
-
-      return isNaN(value) ? minValue === MIN_VALUE ? 0 : minValue : value;
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "isValueValid", function (valueToCheck) {
-      var _this$getParsedValues2 = _this.getParsedValues(valueToCheck),
-          value = _this$getParsedValues2.value,
-          minValue = _this$getParsedValues2.minValue,
-          maxValue = _this$getParsedValues2.maxValue;
-
-      return value >= minValue && value <= maxValue;
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "changeIfValid", function (value) {
-      if (_this.isValueValid(value)) {
-        _this.props.onChange(value);
-      }
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "handleBlur", function (event) {
-      var _this$getParsedValues3 = _this.getParsedValues(event.target.value),
-          value = _this$getParsedValues3.value,
-          minValue = _this$getParsedValues3.minValue,
-          maxValue = _this$getParsedValues3.maxValue;
-
-      if (value < minValue) {
-        _this.props.onChange(minValue);
-      } else if (value > maxValue) {
-        _this.props.onChange(maxValue);
-      } else if (isNaN(event.target.value)) {
-        _this.props.onChange(_this.clampValue(value));
-      }
-
-      if (_this.props.onBlur) {
-        _this.props.onBlur(event);
-      }
-
-      _this.firstTouch = true;
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (event) {
-      if (_this.props.ignoredKeys.includes(event.key)) {
-        return;
-      }
-
-      var _this$props = _this.props,
-          pad = _this$props.pad,
-          step = _this$props.step;
-
-      var _this$getParsedValues4 = _this.getParsedValues(event.target.value),
-          value = _this$getParsedValues4.value,
-          minValue = _this$getParsedValues4.minValue,
-          maxValue = _this$getParsedValues4.maxValue;
-
-      if (isNotAcceptedNumberKey(event) || pad && (event.key === 'ArrowLeft' || event.key === 'ArrowRight')) {
-        event.preventDefault();
-      }
-
-      if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
-        var increment = (event.key === 'ArrowUp' ? 1 : -1) * step;
-
-        var nextValue = _this.clampValue(value + increment);
-
-        var parsedValue = Number.parseFloat(event.target.value.indexOf('.') > -1 ? nextValue.toFixed(2) : nextValue);
-
-        if (_this.isValueValid(parsedValue)) {
-          _this.props.onChange(parsedValue);
-        }
-      }
-
-      if (_this.props.onKeyDown) {
-        _this.props.onKeyDown(event);
-      }
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "handleInput", function (event) {
-      var _this$getParsedValues5 = _this.getParsedValues(event.target.value),
-          maxValue = _this$getParsedValues5.maxValue;
-
-      if (_this.props.pad) {
-        var deleteKeyPressed = event.target.value === '';
-        var targetValue = deleteKeyPressed ? event.target.value : parseFloat(event.target.value);
-
-        if (deleteKeyPressed) {
-          var nextValue = ("" + _this.props.value).slice(0, -1);
-
-          _this.props.onChange(padNumber(nextValue, _this.props.pad));
-        } else {
-          var _nextValue = _this.clampValue(targetValue);
-
-          var paddedValue = parseFloat("" + _this.props.value + targetValue);
-
-          if (!_this.firstTouch && !isNaN(targetValue) && _this.isValueValid(paddedValue)) {
-            _nextValue = paddedValue;
-          }
-
-          _this.firstTouch = false;
-
-          if (_this.props.moveFocusOnMax && _nextValue / maxValue > 0.1) {
-            var _getTabbableSiblings = getTabbableSiblings(event.target),
-                next = _getTabbableSiblings.next;
-
-            if (next) {
-              setTimeout(function () {
-                return next.focus();
-              });
-            }
-          }
-
-          _this.changeIfValid(_nextValue);
-        }
-      } else {
-        _this.props.onChange(event.target.value);
-      }
-    });
-
-    return _this;
-  }
-
-  var _proto = NumberField.prototype;
-
-  _proto.getAutoWidthValue = function getAutoWidthValue(value) {
-    var _this$props2 = this.props,
-        autoWidth = _this$props2.autoWidth,
-        pad = _this$props2.pad,
-        placeholder = _this$props2.placeholder;
-    var isValueEmpty = value === '';
-    return autoWidth || (pad && isValueEmpty ? getPadStringSize(pad) : isValueEmpty && placeholder !== undefined ? placeholder : value);
-  };
-
-  _proto.render = function render() {
-    var _this$props3 = this.props,
-        autoWidth = _this$props3.autoWidth,
-        as = _this$props3.as,
-        highlightOnInteraction = _this$props3.highlightOnInteraction,
-        ignoredKeys = _this$props3.ignoredKeys,
-        min = _this$props3.min,
-        max = _this$props3.max,
-        moveFocusOnMax = _this$props3.moveFocusOnMax,
-        onChange = _this$props3.onChange,
-        onBlur = _this$props3.onBlur,
-        onInput = _this$props3.onInput,
-        onKeyDown = _this$props3.onKeyDown,
-        pad = _this$props3.pad,
-        value = _this$props3.value,
-        restProps = _objectWithoutPropertiesLoose(_this$props3, ["autoWidth", "as", "highlightOnInteraction", "ignoredKeys", "min", "max", "moveFocusOnMax", "onChange", "onBlur", "onInput", "onKeyDown", "pad", "value"]);
-
-    var parsed = this.getParsedValues(value);
-    var numberValue = value === null ? '' : value;
-
-    if (pad && numberValue !== '') {
-      numberValue = padNumber(numberValue, pad);
-    }
-
-    if (parsed.min !== MIN_VALUE) {
-      restProps.min = min;
-    }
-
-    if (parsed.max !== MAX_VALUE) {
-      restProps.max = max;
-    }
-
-    if (autoWidth !== false) {
-      restProps.autoWidth = this.getAutoWidthValue(numberValue);
-
-      if (restProps.autoWidth === undefined) {
-        restProps.autoWidth = true;
-      }
-    }
-
-    return /*#__PURE__*/createElement(as, _objectSpread(_objectSpread({}, restProps), {}, {
-      textOverflow: undefined,
-      autoComplete: 'off',
-      value: numberValue,
-      highlightOnInteraction: highlightOnInteraction || pad,
-      onBlur: this.handleBlur,
-      onInput: this.handleInput,
-      onKeyDown: this.handleKeyDown
-    }));
-  };
-
-  return NumberField;
-}(Component);
-
-_defineProperty(NumberField, "defaultProps", {
-  as: InputField,
-  ignoredKeys: [],
-  min: MIN_VALUE,
-  max: MAX_VALUE,
-  step: 1,
-  moveFocusOnMax: false
-});
-
-export default NumberField;

package/dist/esm/NumberField/NumberField.test.js

@@ -1,190 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { useState } from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import userEvent from '@testing-library/user-event';
-import NumberField from './NumberField';
-describe('value', function () {
-  var TestApp = function TestApp(_ref) {
-    var initialValue = _ref.value,
-        props = _objectWithoutPropertiesLoose(_ref, ["value"]);
-
-    var _useState = useState(initialValue),
-        value = _useState[0],
-        setValue = _useState[1];
-
-    return /*#__PURE__*/React.createElement(NumberField, _extends({}, props, {
-      "data-testid": "test",
-      value: value,
-      onChange: setValue
-    }));
-  };
-
-  var setup = function setup(props) {
-    var _render = render( /*#__PURE__*/React.createElement(TestApp, props)),
-        getByTestId = _render.getByTestId;
-
-    return getByTestId('test');
-  };
-
-  it('renders', function () {
-    var numberField = setup({
-      value: 5
-    });
-    expect(numberField).toHaveValue('5');
-  });
-  it('pads if asked to', function () {
-    var numberField = setup({
-      value: 5,
-      pad: 2
-    });
-    expect(numberField).toHaveValue('05');
-  });
-  it('uses placeholder when empty', function () {
-    var placeholder = 'pick something!';
-    var numberField = setup({
-      placeholder: placeholder
-    });
-    expect(numberField).toHaveAttribute('placeholder', placeholder);
-  });
-  describe('min', function () {
-    it('is used if typed value is lower after blur', function () {
-      var numberField = setup({
-        value: 2,
-        min: 1
-      });
-      userEvent.type(numberField, '{backspace}0');
-      userEvent.tab();
-      expect(numberField).toHaveValue('1');
-    });
-    it('prevents arrow down from going below', function () {
-      var numberField = setup({
-        value: 1,
-        min: 1
-      });
-      userEvent.type(numberField, '{arrowdown}');
-      expect(numberField).toHaveValue('1');
-    });
-  });
-  describe('max', function () {
-    it('is used if typed value is higher after blur', function () {
-      var numberField = setup({
-        value: 0,
-        max: 1
-      });
-      userEvent.type(numberField, '2');
-      userEvent.tab();
-      expect(numberField).toHaveValue('1');
-    });
-    it('prevents arrow up from going above', function () {
-      var numberField = setup({
-        value: 1,
-        max: 1
-      });
-      userEvent.type(numberField, '{arrowup}');
-      expect(numberField).toHaveValue('1');
-    });
-  });
-  describe('pad', function () {
-    it("add appropriate pad", function () {
-      var numberField = setup({
-        value: 0,
-        pad: 2
-      });
-      userEvent.type(numberField, '12{backspace}');
-      expect(numberField).toHaveValue('01');
-    });
-  });
-});
-
-var _ref2 = /*#__PURE__*/React.createElement("input", {
-  "data-testid": "test-b"
-});
-
-describe('moveFocusOnMax', function () {
-  var TestApp = function TestApp(props) {
-    var _useState2 = useState(0),
-        value = _useState2[0],
-        setValue = _useState2[1];
-
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(NumberField, _extends({}, props, {
-      "data-testid": "test-a",
-      value: value,
-      onChange: setValue
-    })), _ref2);
-  };
-
-  var setup = function setup() {
-    var props = {
-      max: 12,
-      pad: 2,
-      moveFocusOnMax: true
-    };
-
-    var _render2 = render( /*#__PURE__*/React.createElement(TestApp, props)),
-        getByTestId = _render2.getByTestId;
-
-    return [getByTestId('test-a'), getByTestId('test-b')];
-  };
-
-  it('moves focus when any further input would exceed max', function () {
-    var _setup = setup(),
-        numberField = _setup[0],
-        nextTabbable = _setup[1];
-
-    userEvent.type(numberField, '2');
-    jest.runAllTimers();
-    expect(nextTabbable).toHaveFocus();
-  });
-  it('does not move focus when some further input is possible without exceeding max', function () {
-    var _setup2 = setup(),
-        numberField = _setup2[0],
-        nextTabbable = _setup2[1];
-
-    userEvent.type(numberField, '1'); // (10, 11, 12) are still possible
-
-    jest.runAllTimers();
-    expect(numberField).toHaveFocus();
-  });
-});
-describe('ignoredKeys', function () {
-  var TestApp = function TestApp(props) {
-    var _useState3 = useState(1),
-        value = _useState3[0],
-        setValue = _useState3[1];
-
-    return /*#__PURE__*/React.createElement(NumberField, _extends({}, props, {
-      "data-testid": "test",
-      value: value,
-      onChange: setValue
-    }));
-  };
-
-  var setup = function setup() {
-    var props = {
-      ignoredKeys: ['ArrowUp', 'ArrowDown']
-    };
-
-    var _render3 = render( /*#__PURE__*/React.createElement(TestApp, props)),
-        getByTestId = _render3.getByTestId;
-
-    return getByTestId('test');
-  };
-
-  it('prevents specified keys from changing values', function () {
-    var numberField = setup();
-    userEvent.type(numberField, '{arrowup}');
-    jest.runAllTimers();
-    expect(numberField).toHaveValue('1');
-    userEvent.type(numberField, '{arrowdown}');
-    jest.runAllTimers();
-    expect(numberField).toHaveValue('1');
-  });
-  it('allows other keys from change the value', function () {
-    var numberField = setup();
-    userEvent.type(numberField, '2');
-    jest.runAllTimers();
-    expect(numberField).toHaveValue('12');
-  });
-});

package/dist/esm/NumberField/index.js

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

package/dist/esm/Page/PageActions.js

@@ -1,17 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
-import StackView from '../StackView';
-
-function PageActions(props) {
-  return /*#__PURE__*/React.createElement(StackView, _extends({
-    alignment: "center",
-    alignSelf: "end",
-    axis: "horizontal",
-    distribution: "end",
-    flex: "1",
-    paddingBottom: 2,
-    spacing: 1
-  }, props));
-}
-
-export default PageActions;

package/dist/esm/Page/PageBody.js

@@ -1,43 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { Children, cloneElement } from 'react';
-import { useThemeValue } from '../system';
-import StackView from '../StackView';
-
-function PageBody(_ref) {
-  var children = _ref.children,
-      inset = _ref.inset,
-      sidebar = _ref.sidebar,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "inset", "sidebar"]);
-
-  var themeProps = useThemeValue('pageBody');
-  var childrenToRender = sidebar ? Children.toArray([/*#__PURE__*/cloneElement(sidebar, {
-    basis: 28
-  }), /*#__PURE__*/React.createElement(StackView, {
-    grow: 1,
-    padding: 3,
-    shrink: 1
-  }, children)]) : children;
-  return /*#__PURE__*/React.createElement(StackView, _extends({
-    padding: sidebar && !inset ? 0 : 3,
-    backgroundColor: "backgroundSecondary",
-    mediaQueries: {
-      md: {
-        axis: sidebar && !inset ? 'horizontal' : undefined
-      }
-    }
-  }, themeProps, restProps), inset ? /*#__PURE__*/React.createElement(StackView, {
-    borderColor: "separatorSecondary",
-    borderWidth: 1,
-    mediaQueries: {
-      md: {
-        axis: sidebar ? 'horizontal' : undefined
-      }
-    },
-    padding: sidebar ? null : 3,
-    radius: 3,
-    shrink: 1
-  }, childrenToRender) : childrenToRender);
-}
-
-export default PageBody;

package/dist/esm/Page/PageButton.js

@@ -1,13 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
-import { useThemeValue } from '../system';
-import Button from '../Button';
-
-function PageButton(props) {
-  var themeProps = useThemeValue('pageButton');
-  return /*#__PURE__*/React.createElement(Button, _extends({
-    theme: "white"
-  }, themeProps, props));
-}
-
-export default PageButton;

package/dist/esm/Page/PageDropdown.js

@@ -1,14 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
-import { useThemeValue } from '../system';
-import Dropdown from '../Dropdown';
-
-function PageDropdown(props) {
-  var themeProps = useThemeValue('pageDropdown');
-  return /*#__PURE__*/React.createElement(Dropdown, _extends({
-    theme: "white",
-    variant: "outline"
-  }, themeProps, props));
-}
-
-export default PageDropdown;