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

package/dist/esm/Select/utils.js

@@ -1,106 +0,0 @@
-import React, { Children, cloneElement, isValidElement } from 'react';
-import Box from '../Box';
-import Menu from '../Menu';
-import { shallowEqual } from '../utils';
-import { OPTIONGROUP_DISPLAY_NAME, OPTION_DISPLAY_NAME } from './constants';
-import Option from './Option';
-import OptionGroup from './OptionGroup';
-export function getSelectedOptions(children, selected) {
-  var selectedChildren = [];
-  var index = -1;
-
-  function getSelectedOption(child) {
-    index++;
-
-    if (selected(child.props.value)) {
-      return {
-        index: index,
-        value: child.props.value,
-        text: child.props.text,
-        children: typeof child.props.children === 'function' ? child.props.children() : child.props.children
-      };
-    } else {
-      return false;
-    }
-  }
-
-  function pushSelectedOption(child) {
-    var option = getSelectedOption(child);
-
-    if (option) {
-      selectedChildren.push(option);
-    }
-  }
-
-  Children.toArray(children).forEach(function (child) {
-    if (child) {
-      if (child.type.displayName === OPTIONGROUP_DISPLAY_NAME) {
-        Children.toArray(child.props.children).filter(isValidElement).forEach(function (grandChild) {
-          if (grandChild.type.displayName === OPTION_DISPLAY_NAME) {
-            pushSelectedOption(grandChild);
-          }
-        });
-      }
-
-      if (child.type.displayName === OPTION_DISPLAY_NAME) {
-        pushSelectedOption(child);
-      }
-    }
-  });
-  return selectedChildren;
-}
-export function renderOptions(children) {
-  var index = -1;
-
-  function renderOption(child) {
-    index++;
-    return /*#__PURE__*/cloneElement(child, {
-      index: index
-    });
-  }
-
-  return Children.map(children, function (child) {
-    if (child) {
-      if (child.type.displayName === OPTIONGROUP_DISPLAY_NAME) {
-        return /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Menu.Heading, null, child.props.title), Children.map(child.props.children, renderOption));
-      }
-
-      if (child.type.displayName === OPTION_DISPLAY_NAME) {
-        return renderOption(child);
-      }
-    }
-
-    return child;
-  });
-}
-export function optionsToElements(options) {
-  return options.map(function (option) {
-    return option.optgroup ? /*#__PURE__*/React.createElement(OptionGroup, {
-      title: option.label,
-      children: option.optgroup.map(function (option) {
-        return /*#__PURE__*/React.createElement(Option, {
-          value: option.value
-        }, option.label);
-      })
-    }) : /*#__PURE__*/React.createElement(Option, {
-      value: option.value
-    }, option.label);
-  });
-}
-export function toggleValue(collection, item) {
-  var previousValue = false;
-  var newValue = collection.reduce(function (newCollection, value) {
-    if (shallowEqual(item, value)) {
-      previousValue = true;
-      return newCollection;
-    } else {
-      return [].concat(newCollection, [value]);
-    }
-  }, []);
-
-  if (!previousValue) {
-    newValue.push(item);
-  }
-
-  return newValue;
-}

package/dist/esm/Sidebar/Sidebar.js

@@ -1,41 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-
-/** @jsxRuntime classic */
-
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import { Children } from 'react';
-import StickyBox from 'react-sticky-box';
-import { css } from '../system';
-import StackView from '../StackView';
-import SidebarList from './SidebarList';
-import SidebarItem from './SidebarItem';
-var flexColumnCss = css({
-  display: 'flex',
-  flexDirection: 'column'
-});
-
-function Sidebar(_ref) {
-  var children = _ref.children,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children"]);
-
-  return jsx(StackView, _extends({
-    grow: 1,
-    paddingTop: 2,
-    boxShadow: "inset -8px 0px 8px -8px rgba(150, 150, 150, 0.25)",
-    backgroundColor: "surfaceTertiary"
-  }, restProps), jsx(StickyBox, {
-    css: flexColumnCss
-  }, Children.map(children, function (child) {
-    if (child && child.type !== Sidebar.List && child.type !== Sidebar.Item) {
-      console.warn("Invalid component nesting. " + child.type + " cannot appear as a child of <Sidebar>. Only <Sidebar.List/> or <Sidebar.Item/> may be used.");
-    }
-
-    return child;
-  })));
-}
-
-Sidebar.List = SidebarList;
-Sidebar.Item = SidebarItem;
-export default Sidebar;

package/dist/esm/Sidebar/SidebarItem.js

@@ -1,44 +0,0 @@
-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 from 'react';
-import List from '../List';
-
-function SidebarItem(_ref) {
-  var active = _ref.active,
-      url = _ref.url,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["active", "url"]);
-
-  var link = !active && url;
-
-  var listItemProps = _objectSpread({
-    alignItems: 'center',
-    backgroundColor: 'surfaceTertiary',
-    boxShadow: 'inset -8px 0px 8px -8px rgba(150, 150, 150, 0.25)',
-    as: link ? 'a' : 'div',
-    href: url,
-    justifyContent: 'space-between',
-    lineHeight: '20px',
-    shrink: 0
-  }, restProps);
-
-  if (active) {
-    listItemProps.backgroundColor = 'surfaceSecondary';
-    listItemProps.boxShadow = 'inset 0 -2px var(--colors-primary)';
-    listItemProps.zIndex = 1;
-  }
-
-  if (link) {
-    listItemProps.hover = {
-      backgroundColor: 'grey-2'
-    };
-  }
-
-  return /*#__PURE__*/React.createElement(List.Item, listItemProps);
-}
-
-export default SidebarItem;

package/dist/esm/Sidebar/SidebarList.js

@@ -1,17 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import React from 'react';
-import List from '../List';
-
-function SidebarList(props) {
-  return /*#__PURE__*/React.createElement(List, _extends({
-    as: "div",
-    marginBottom: 2,
-    border: true,
-    borderColor: "separatorSecondary",
-    shrink: 0,
-    divider: true,
-    dividerColor: "separatorSecondary"
-  }, props));
-}
-
-export default SidebarList;

package/dist/esm/Sidebar/index.js

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

package/dist/esm/Sortable/SortableEmpty.js

@@ -1,31 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import Box from '../Box';
-import Text from '../Text';
-
-function SortableEmpty(_ref) {
-  var emptyText = _ref.emptyText,
-      isDraggingOver = _ref.isDraggingOver,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["emptyText", "isDraggingOver"]);
-
-  return /*#__PURE__*/React.createElement(Box, _extends({
-    column: 1,
-    row: 1,
-    padding: 1,
-    backgroundColor: isDraggingOver ? 'warning-lightest' : 'white'
-  }, restProps), /*#__PURE__*/React.createElement(Box, {
-    padding: 0.5,
-    backgroundColor: isDraggingOver ? 'warning-lightest' : 'white',
-    borderWidth: 1,
-    borderStyle: "dashed",
-    borderColor: isDraggingOver ? 'warning' : 'grey-5',
-    radius: 3
-  }, /*#__PURE__*/React.createElement(Text, {
-    fontSize: 5,
-    textAlign: "center",
-    opacity: isDraggingOver ? 0 : 1
-  }, emptyText)));
-}
-
-export default SortableEmpty;

package/dist/esm/Sortable/SortableItem.js

@@ -1,43 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import Box from '../Box';
-import DragDrop from '../DragDrop';
-import Icon from '../Icon';
-import List from '../List';
-import { SORTABLE_TYPE } from './constants';
-export var SORTABLE_ITEM_DISPLAY_NAME = 'SortableItem';
-
-var _ref2 = /*#__PURE__*/React.createElement(Icon, {
-  name: "general.dragHandle",
-  size: "sm",
-  color: "foregroundTertiary"
-});
-
-function SortableItem(_ref) {
-  var children = _ref.children,
-      disabled = _ref.disabled,
-      id = _ref.id,
-      index = _ref.index,
-      isDraggingOver = _ref.isDraggingOver,
-      onRemoveRequest = _ref.onRemoveRequest,
-      readOnly = _ref.readOnly,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "id", "index", "isDraggingOver", "onRemoveRequest", "readOnly"]);
-
-  return /*#__PURE__*/React.createElement(DragDrop.Draggable, {
-    type: SORTABLE_TYPE,
-    draggableId: id,
-    isDragDisabled: disabled || readOnly,
-    index: index
-  }, function (provided) {
-    return /*#__PURE__*/React.createElement(List.Item, _extends({
-      innerRef: provided.innerRef,
-      onRemoveRequest: onRemoveRequest
-    }, restProps, provided.draggableProps), !readOnly && /*#__PURE__*/React.createElement(Box, _extends({}, provided.dragHandleProps, {
-      marginRight: 1
-    }), _ref2), children);
-  });
-}
-
-SortableItem.displayName = SORTABLE_ITEM_DISPLAY_NAME;
-export default SortableItem;

package/dist/esm/Sortable/SortableList.js

@@ -1,85 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React, { Children } from 'react';
-import Box from '../Box';
-import DragDrop from '../DragDrop';
-import GridView from '../GridView';
-import HeadingUppercase from '../HeadingUppercase';
-import { cloneChildren } from '../utils';
-import { SORTABLE_TYPE } from './constants';
-import SortableEmpty from './SortableEmpty';
-import { SORTABLE_ITEM_DISPLAY_NAME } from './SortableItem';
-
-function SortableList(_ref) {
-  var children = _ref.children,
-      disabled = _ref.disabled,
-      emptyText = _ref.emptyText,
-      id = _ref.id,
-      onItemRemoveRequest = _ref.onItemRemoveRequest,
-      title = _ref.title,
-      readOnly = _ref.readOnly,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "emptyText", "id", "onItemRemoveRequest", "title", "readOnly"]);
-
-  var childCount = Children.count(children);
-  return /*#__PURE__*/React.createElement(Box, restProps, title && /*#__PURE__*/React.createElement(HeadingUppercase, {
-    padding: 1,
-    backgroundColor: "surfaceSecondary",
-    borderBottomWidth: 1,
-    borderBottomColor: "separatorTertiary"
-  }, title), /*#__PURE__*/React.createElement(DragDrop.Droppable, {
-    type: SORTABLE_TYPE,
-    isDropDisabled: disabled || readOnly,
-    droppableId: id
-  }, function (provided, snapshot) {
-    return /*#__PURE__*/React.createElement(GridView, _extends({
-      innerRef: provided.innerRef,
-      minHeight: 5,
-      backgroundColor: "surfaceSecondary",
-      position: "relative",
-      css: emptyText && childCount <= 0 ? {
-        '[data-rbd-placeholder-context-id]': {
-          column: 1,
-          row: 1
-        }
-      } : undefined
-    }, provided.droppableProps), emptyText && childCount <= 0 && /*#__PURE__*/React.createElement(SortableEmpty, {
-      emptyText: emptyText,
-      isDraggingOver: snapshot.isDraggingOver
-    }), cloneChildren(children, function (child, _ref2) {
-      var index = _ref2.index;
-      var childProps = {
-        pointerEvents: snapshot.isDraggingOver ? 'none' : undefined
-      };
-
-      if (index !== 0) {
-        childProps.borderTopWidth = 1;
-        childProps.borderTopColor = 'separatorTertiary';
-      }
-
-      if (child && child.type.displayName === SORTABLE_ITEM_DISPLAY_NAME) {
-        childProps.index = index;
-
-        if (!readOnly && !snapshot.isDraggingOver && (onItemRemoveRequest || child.props.onRemoveRequest)) {
-          childProps.onRemoveRequest = function (e) {
-            var itemPayload = {
-              id: id,
-              index: index
-            };
-
-            if (onItemRemoveRequest) {
-              onItemRemoveRequest(itemPayload, e);
-            }
-
-            if (child.props.onRemoveRequest) {
-              child.props.onRemoveRequest(itemPayload, e);
-            }
-          };
-        }
-      }
-
-      return childProps;
-    }), provided.placeholder);
-  }));
-}
-
-export default SortableList;

package/dist/esm/Sortable/SortableManager.js

@@ -1,19 +0,0 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import Box from '../Box';
-import DragDrop from '../DragDrop';
-export default (function (_ref) {
-  var children = _ref.children,
-      onDragStart = _ref.onDragStart,
-      onDragUpdate = _ref.onDragUpdate,
-      _onDragEnd = _ref.onDragEnd,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["children", "onDragStart", "onDragUpdate", "onDragEnd"]);
-
-  return /*#__PURE__*/React.createElement(DragDrop.Provider, {
-    onDragStart: onDragStart,
-    onDragUpdate: onDragUpdate,
-    onDragEnd: function onDragEnd(props) {
-      return props.destination && _onDragEnd(props);
-    }
-  }, /*#__PURE__*/React.createElement(Box, restProps, children));
-});

package/dist/esm/Sortable/constants.js

@@ -1 +0,0 @@
-export var SORTABLE_TYPE = 'SORTABLE_LIST';

package/dist/esm/Sortable/index.js

@@ -1,47 +0,0 @@
-import SortableItem from './SortableItem';
-import SortableList from './SortableList';
-import SortableManager from './SortableManager';
-
-var insert = function insert(_ref) {
-  var fromList = _ref.fromList,
-      fromIndex = _ref.fromIndex,
-      toList = _ref.toList,
-      toIndex = _ref.toIndex;
-  var result = Array.from(toList);
-
-  var _Array$from$splice = Array.from(fromList).splice(fromIndex, 1),
-      removed = _Array$from$splice[0];
-
-  result.splice(toIndex, 0, removed);
-  return result;
-};
-
-var remove = function remove(_ref2) {
-  var list = _ref2.list,
-      index = _ref2.index;
-  var result = Array.from(list);
-  result.splice(index, 1);
-  return result;
-};
-
-var reorder = function reorder(_ref3) {
-  var list = _ref3.list,
-      startIndex = _ref3.startIndex,
-      endIndex = _ref3.endIndex;
-  var result = Array.from(list);
-
-  var _result$splice = result.splice(startIndex, 1),
-      removed = _result$splice[0];
-
-  result.splice(endIndex, 0, removed);
-  return result;
-};
-
-export default {
-  SortableItem: SortableItem,
-  SortableList: SortableList,
-  SortableManager: SortableManager,
-  insert: insert,
-  remove: remove,
-  reorder: reorder
-};

package/dist/esm/Spinner/Spinner.js

@@ -1,65 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import { keyframes } from '@emotion/react';
-import { Box } from '../Box';
-import { useThemeProps } from '../system';
-var rotate = keyframes({
-  '100%': {
-    transform: 'rotate(360deg)'
-  }
-});
-var rotateCentered = keyframes({
-  '100%': {
-    transform: 'translate(-50%, -50%) rotate(360deg)'
-  }
-});
-export function Spinner(_ref) {
-  var center = _ref.center,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size,
-      thickness = _ref.thickness,
-      props = _objectWithoutPropertiesLoose(_ref, ["center", "size", "thickness"]);
-
-  var _useThemeProps = useThemeProps('spinner', props),
-      color = _useThemeProps.color,
-      sizes = _useThemeProps.sizes,
-      sizeThickness = _useThemeProps.thickness,
-      trackColor = _useThemeProps.trackColor,
-      restProps = _objectWithoutPropertiesLoose(_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.createElement(Box, _extends({}, boxProps, boxSizeStyles, restProps));
-}

package/dist/esm/Spinner/index.js

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

package/dist/esm/StackView/StackView.js

@@ -1,90 +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; }
-
-/** @jsxRuntime classic */
-
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import * as React from 'react';
-import splitStyles from '../system/split-styles';
-import { spacingValue } from '../system';
-import { joinChildren } from '../utils';
-import { useVariant } from '../VariantProvider';
-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 = _objectWithoutPropertiesLoose(_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 = spacingValue(spacing);
-    }
-
-    return styles;
-  }
-};
-var defaultElement = 'div';
-export function StackView(_ref2) {
-  var as = _ref2.as,
-      children = _ref2.children,
-      inline = _ref2.inline,
-      innerRef = _ref2.innerRef,
-      props = _objectWithoutPropertiesLoose(_ref2, ["as", "children", "inline", "innerRef"]);
-
-  var Element = as || defaultElement;
-  var variant = useVariant();
-  var childrenToRender = Element === 'textarea' ? undefined : typeof props.spacing === 'object' ? joinChildren(children, props.spacing) : children;
-  return jsx(Element, _extends({
-    ref: innerRef
-  }, splitStyles(_objectSpread({
-    display: inline ? 'inline-flex' : 'flex',
-    axis: VERTICAL,
-    plugin: stackViewPlugin,
-    variant: variant
-  }, props))), childrenToRender);
-}
-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/esm/StackView/index.js

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

package/dist/esm/StepperField/StepperField.js

@@ -1,67 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import React from 'react';
-import Button from '../Button';
-import { useBoxSize, useThemeProps } from '../system';
-import NumberField from '../NumberField';
-import StackView from '../StackView';
-
-function StepperField(_ref) {
-  var _ref$min = _ref.min,
-      min = _ref$min === void 0 ? -Infinity : _ref$min,
-      _ref$max = _ref.max,
-      max = _ref$max === void 0 ? Infinity : _ref$max,
-      onChange = _ref.onChange,
-      _ref$step = _ref.step,
-      step = _ref$step === void 0 ? 1 : _ref$step,
-      value = _ref.value,
-      restProps = _objectWithoutPropertiesLoose(_ref, ["min", "max", "onChange", "step", "value"]);
-
-  var _useThemeProps = useThemeProps('stepperField', restProps),
-      _useThemeProps$size = _useThemeProps.size,
-      size = _useThemeProps$size === void 0 ? 'md' : _useThemeProps$size,
-      themeProps = _objectWithoutPropertiesLoose(_useThemeProps, ["size"]);
-
-  var _useBoxSize = useBoxSize(size),
-      fontSize = _useBoxSize.fontSize,
-      paddingHorizontal = _useBoxSize.paddingHorizontal,
-      navigateSize = _useBoxSize.navigateSize;
-
-  return /*#__PURE__*/React.createElement(StackView, _extends({
-    axis: "horizontal",
-    fontSize: fontSize
-  }, themeProps), /*#__PURE__*/React.createElement(Button, {
-    size: size,
-    title: "Decrement by " + step,
-    icon: {
-      name: 'general.minus',
-      size: navigateSize(size, -1)
-    },
-    disabled: value <= min,
-    onClick: function onClick() {
-      return onChange(Math.max(value - step, min));
-    }
-  }), /*#__PURE__*/React.createElement(NumberField, {
-    fontSize: "inherit",
-    paddingHorizontal: paddingHorizontal,
-    min: min,
-    max: max,
-    step: step,
-    size: size,
-    value: value,
-    onChange: onChange
-  }), /*#__PURE__*/React.createElement(Button, {
-    size: size,
-    title: "Increment by " + step,
-    icon: {
-      name: 'general.plus',
-      size: navigateSize(size, -1)
-    },
-    disabled: value >= max,
-    onClick: function onClick() {
-      return onChange(Math.min(value + step), max);
-    }
-  }));
-}
-
-export default StepperField;