@blockstack/ui/dist/input-addon/index.esm.js

Blockstack UI components built using React and styled-components with styled-system.

import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
import React__default from 'react';
import { Box } from '../box/index.esm.js';
import { oneOf } from 'prop-types';
import useInputStyle from '../input/styles.esm.js';

var InputAddon = function InputAddon(_ref) {
  var _ref$placement = _ref.placement,
      placement = _ref$placement === void 0 ? 'left' : _ref$placement,
      props = _objectWithoutPropertiesLoose(_ref, ["placement"]);

  var _placement = {
    left: {
      mr: '-1px',
      roundedRight: 0,
      borderRightColor: 'transparent',
      borderLeftWidth: 0
    },
    right: {
      order: 1,
      roundedLeft: 0,
      borderLeftColor: 'transparent',
      borderLeftWidth: 0
    }
  };

  var styleProps = _objectSpread2({}, useInputStyle({
    variant: 'outline'
  }), {
    flex: '0 0 auto',
    whiteSpace: 'nowrap',
    bg: 'white',
    fontSize: 'body.small'
  }, _placement[placement]);

  return React__default.createElement(Box, Object.assign({}, styleProps, props, {
    css: {
      'input:focus + &': {
        zIndex: -1
      }
    }
  }));
};

process.env.NODE_ENV !== "production" ? InputAddon.propTypes = {
  placement: /*#__PURE__*/oneOf(['left', 'right'])
} : void 0;
InputAddon.displayName = 'InputAddon';

var InputLeftAddon = function InputLeftAddon(props) {
  return React__default.createElement(InputAddon, Object.assign({
    placement: "left"
  }, props));
};

var InputRightAddon = function InputRightAddon(props) {
  return React__default.createElement(InputAddon, Object.assign({
    placement: "right"
  }, props));
};

export { InputAddon, InputLeftAddon, InputRightAddon };
//# sourceMappingURL=index.esm.js.map