@spothero/ui 17.0.0-beta.1 → 17.0.0-beta.2

package/dist/components/Switch/Switch.stories.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Switch = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Switch = _interopRequireDefault(require("./Switch"));
+
+var _default = {
+  title: 'v2/Switch',
+  component: _Switch.default,
+  parameters: {
+    removeBaseHtmlClass: true
+  }
+};
+exports.default = _default;
+
+var SwitchTemplate = function SwitchTemplate(props) {
+  return /*#__PURE__*/_react.default.createElement(_Switch.default, props);
+};
+
+var Switch = SwitchTemplate.bind({});
+exports.Switch = Switch;
+Switch.argTypes = {
+  isChecked: {
+    control: {
+      type: 'boolean'
+    }
+  },
+  defaultChecked: {
+    control: {
+      type: 'boolean'
+    }
+  },
+  id: {
+    control: {
+      type: 'text'
+    }
+  },
+  label: {
+    control: {
+      type: 'text'
+    }
+  },
+  helperText: {
+    control: {
+      type: 'text'
+    }
+  },
+  errorMessage: {
+    control: {
+      type: 'text'
+    }
+  },
+  isInvalid: {
+    control: {
+      type: 'boolean'
+    }
+  },
+  isDisabled: {
+    control: {
+      type: 'boolean'
+    }
+  },
+  isRequired: {
+    control: {
+      type: 'boolean'
+    }
+  }
+};
+Switch.args = {
+  isChecked: true,
+  defaultChecked: false,
+  id: 'Switch_Id',
+  label: 'Label',
+  helperText: 'Helper Text',
+  errorMessage: 'Error Message',
+  isInvalid: false,
+  isDisabled: false,
+  isRequired: false
+};

package/dist/components/Switch/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Switch.default;
+  }
+});
+
+var _Switch = _interopRequireDefault(require("./Switch"));

package/dist/components/Switch/styles/index.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var overrides = {
+  defaultProps: {
+    colorScheme: 'primary',
+    size: 'lg'
+  },
+  baseStyle: function baseStyle(props) {
+    return (0, _merge.default)(_theme.default.components.Switch.baseStyle(props), {
+      track: {
+        bg: 'gray.medium'
+      }
+    });
+  }
+};
+
+var _default = _objectSpread(_objectSpread({}, _theme.default.components.Switch), overrides);
+
+exports.default = _default;

package/dist/components/Table/Table.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _react.Table;
+  }
+});
+
+var _react = require("@chakra-ui/react");

package/dist/components/Table/Table.stories.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Table = void 0;
+
+var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _fill = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/fill"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Table = _interopRequireDefault(require("./Table"));
+
+var _Table2 = require("./Table.styles");
+
+var _index = require("./index");
+
+var _default = {
+  title: 'v2/Table',
+  parameters: {
+    removeBaseHtmlClass: true
+  },
+  argTypes: {
+    numberOfColumns: {
+      table: {
+        disable: true
+      }
+    },
+    numberOfRows: {
+      table: {
+        disable: true
+      }
+    },
+    tableData: {
+      table: {
+        disable: true
+      }
+    },
+    tableHeading: {
+      table: {
+        disable: true
+      }
+    },
+    variant: {
+      control: {
+        type: 'select',
+        options: (0, _keys.default)(_Table2.variants)
+      }
+    }
+  }
+};
+exports.default = _default;
+
+var TableTemplate = function TableTemplate(_ref) {
+  var _context, _context2, _context3, _context4, _context5;
+
+  var numberOfColumns = _ref.numberOfColumns,
+      numberOfRows = _ref.numberOfRows,
+      tableData = _ref.tableData,
+      tableHeading = _ref.tableHeading,
+      variant = _ref.variant;
+  return /*#__PURE__*/_react.default.createElement(_Table.default, {
+    variant: variant
+  }, /*#__PURE__*/_react.default.createElement(_index.Thead, null, /*#__PURE__*/_react.default.createElement(_index.Tr, null, (0, _map.default)(_context = (0, _fill.default)(_context2 = Array(numberOfColumns)).call(_context2, tableHeading)).call(_context, function (heading, index) {
+    return /*#__PURE__*/_react.default.createElement(_index.Th, {
+      key: index
+    }, heading);
+  }))), /*#__PURE__*/_react.default.createElement(_index.Tbody, null, (0, _map.default)(_context3 = (0, _fill.default)(_context4 = Array(numberOfRows)).call(_context4, (0, _fill.default)(_context5 = Array(numberOfColumns)).call(_context5, tableData))).call(_context3, function (row, i) {
+    return /*#__PURE__*/_react.default.createElement(_index.Tr, {
+      key: i
+    }, (0, _map.default)(row).call(row, function (data, index) {
+      return /*#__PURE__*/_react.default.createElement(_index.Td, {
+        key: index
+      }, data);
+    }));
+  })));
+};
+
+var Table = TableTemplate.bind({});
+exports.Table = Table;
+Table.args = {
+  numberOfColumns: 3,
+  numberOfRows: 3,
+  tableData: 'Table cell data',
+  tableHeading: 'Column Heading'
+};

package/dist/components/Table/Table.styles.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.variants = exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _Heading = require("../Heading/Heading.styles");
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var parts = ['table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption'];
+var baseStyle = {
+  table: {
+    borderCollapse: 'collapse',
+    color: 'text.primary.light',
+    width: '100%'
+  },
+  thead: {
+    borderBottom: '1px',
+    borderColor: 'gray.medium'
+  },
+  th: {
+    fontFamily: 'heading',
+    fontSize: _Heading.variants.h4.fontSize,
+    fontWeight: 'semibold',
+    letterSpacing: 'unset',
+    padding: 4,
+    textAlign: 'start',
+    textTransform: 'none'
+  },
+  tr: {
+    borderBottom: '1px',
+    borderColor: 'gray.medium',
+    _last: {
+      border: 'none'
+    }
+  },
+  td: {
+    padding: 4,
+    textAlign: 'start'
+  }
+};
+var roundedWhiteVariant = {
+  table: {
+    backgroundColor: 'background.white',
+    borderRadius: 6,
+    boxShadow: 'md',
+    marginBottom: 1
+  }
+};
+var roundedGrayVariant = {
+  table: _objectSpread(_objectSpread({}, roundedWhiteVariant.table), {}, {
+    backgroundColor: 'background.gray'
+  })
+};
+var variants = {
+  rounded: roundedWhiteVariant,
+  roundedGray: roundedGrayVariant
+};
+exports.variants = variants;
+var defaultProps = {
+  variant: 'rounded'
+};
+var _default = {
+  parts: parts,
+  variants: variants,
+  baseStyle: baseStyle,
+  defaultProps: defaultProps
+};
+exports.default = _default;

package/dist/components/Table/index.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Table", {
+  enumerable: true,
+  get: function get() {
+    return _Table.default;
+  }
+});
+Object.defineProperty(exports, "TableCaption", {
+  enumerable: true,
+  get: function get() {
+    return _react.TableCaption;
+  }
+});
+Object.defineProperty(exports, "Tbody", {
+  enumerable: true,
+  get: function get() {
+    return _react.Tbody;
+  }
+});
+Object.defineProperty(exports, "Td", {
+  enumerable: true,
+  get: function get() {
+    return _react.Td;
+  }
+});
+Object.defineProperty(exports, "Tfoot", {
+  enumerable: true,
+  get: function get() {
+    return _react.Tfoot;
+  }
+});
+Object.defineProperty(exports, "Th", {
+  enumerable: true,
+  get: function get() {
+    return _react.Th;
+  }
+});
+Object.defineProperty(exports, "Thead", {
+  enumerable: true,
+  get: function get() {
+    return _react.Thead;
+  }
+});
+Object.defineProperty(exports, "Tr", {
+  enumerable: true,
+  get: function get() {
+    return _react.Tr;
+  }
+});
+
+var _Table = _interopRequireDefault(require("./Table"));
+
+var _react = require("@chakra-ui/react");

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.SIZE_SMALL = exports.SIZE_HEADING = exports.SIZE_BODY = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@chakra-ui/react");
+
+var _combineSizeWithVariant = _interopRequireDefault(require("./combineSizeWithVariant"));
+
+var _excluded = ["size"];
+
+var _sizeMapping;
+
+var SIZE_SMALL = 'small';
+exports.SIZE_SMALL = SIZE_SMALL;
+var SIZE_BODY = 'body';
+exports.SIZE_BODY = SIZE_BODY;
+var SIZE_HEADING = 'heading';
+exports.SIZE_HEADING = SIZE_HEADING;
+var sizeMapping = (_sizeMapping = {}, (0, _defineProperty2.default)(_sizeMapping, SIZE_SMALL, 'sm'), (0, _defineProperty2.default)(_sizeMapping, SIZE_BODY, 'md'), (0, _defineProperty2.default)(_sizeMapping, SIZE_HEADING, 'lg'), _sizeMapping);
+var Tabs = (0, _react2.forwardRef)(function (_ref, ref) {
+  var size = _ref.size,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_react2.Tabs, (0, _extends2.default)({
+    size: sizeMapping[size]
+  }, props, (0, _combineSizeWithVariant.default)({
+    size: size
+  }), {
+    ref: ref
+  }));
+});
+Tabs.defaultProps = {
+  size: SIZE_BODY
+};
+var _default = Tabs;
+exports.default = _default;

package/dist/components/Tabs/Tabs.stories.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Tabs = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Tabs = _interopRequireWildcard(require("./Tabs"));
+
+var _index = require("./index");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _default = {
+  title: 'v2/Tabs',
+  parameters: {
+    removeBaseHtmlClass: true
+  },
+  argTypes: {
+    size: {
+      control: {
+        type: 'select',
+        options: [_Tabs.SIZE_SMALL, _Tabs.SIZE_BODY, _Tabs.SIZE_HEADING]
+      }
+    }
+  }
+};
+exports.default = _default;
+
+var TabsTemplate = function TabsTemplate(props) {
+  return /*#__PURE__*/_react.default.createElement(_Tabs.default, (0, _extends2.default)({
+    variant: "line"
+  }, props), /*#__PURE__*/_react.default.createElement(_index.TabList, null, /*#__PURE__*/_react.default.createElement(_index.Tab, null, "One"), /*#__PURE__*/_react.default.createElement(_index.Tab, null, "Two"), /*#__PURE__*/_react.default.createElement(_index.Tab, null, "Three")), /*#__PURE__*/_react.default.createElement(_index.TabPanels, null, /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "one!")), /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "two!")), /*#__PURE__*/_react.default.createElement(_index.TabPanel, null, /*#__PURE__*/_react.default.createElement("p", null, "three!"))));
+};
+
+var Tabs = TabsTemplate.bind({});
+exports.Tabs = Tabs;

package/dist/components/Tabs/combineSizeWithVariant.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _index = _interopRequireDefault(require("./styles/index"));
+
+var _typography = require("../../theme/base/typography");
+
+var _Tabs = require("./Tabs");
+
+/**
+ * ### `combineSizeWithVariant`
+ * A function that takes in the `size` value, and the
+ * `variant` value. The default-like styling for the `size` prop is merged with the styling from the
+ * `variant` and a combined styleProp object is returned.
+ *
+ * @function combineSizeWithVariant
+ * @param {string} args.size - The size of Tabs component
+ * @param {string} args.variant - The style variant for the Text component
+ * @returns {Object} An object containing the merged styleProps from the `variant` and the `size` props
+ */
+var combineSizeWithVariant = function combineSizeWithVariant(_ref) {
+  var _fontSizeMapping;
+
+  var size = _ref.size,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? 'line' : _ref$variant;
+  var fontSizeMapping = (_fontSizeMapping = {}, (0, _defineProperty2.default)(_fontSizeMapping, _Tabs.SIZE_SMALL, _typography.fontSizes.xs), (0, _defineProperty2.default)(_fontSizeMapping, _Tabs.SIZE_BODY, _typography.fontSizes.base), (0, _defineProperty2.default)(_fontSizeMapping, _Tabs.SIZE_HEADING, _typography.fontSizes.lg), _fontSizeMapping);
+
+  var styleProps = _index.default.variants["".concat(variant)];
+
+  styleProps.tab.fontSize = fontSizeMapping[size];
+  return styleProps;
+};
+
+var _default = combineSizeWithVariant;
+exports.default = _default;

package/dist/components/Tabs/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Tab", {
+  enumerable: true,
+  get: function get() {
+    return _react.Tab;
+  }
+});
+Object.defineProperty(exports, "TabList", {
+  enumerable: true,
+  get: function get() {
+    return _react.TabList;
+  }
+});
+Object.defineProperty(exports, "TabPanel", {
+  enumerable: true,
+  get: function get() {
+    return _react.TabPanel;
+  }
+});
+Object.defineProperty(exports, "TabPanels", {
+  enumerable: true,
+  get: function get() {
+    return _react.TabPanels;
+  }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Tabs.default;
+  }
+});
+
+var _Tabs = _interopRequireDefault(require("./Tabs"));
+
+var _react = require("@chakra-ui/react");

package/dist/components/Tabs/styles/index.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
+
+var variants = {
+  line: {
+    tablist: {
+      borderBottom: '2px solid',
+      borderColor: 'inherit'
+    },
+    tab: {
+      color: 'gray.600',
+      borderBottom: '2px solid',
+      borderColor: 'transparent',
+      marginBottom: '-2px',
+      _selected: {
+        color: 'primary.default',
+        borderColor: 'primary.default',
+        fontWeight: 'semibold'
+      },
+      _focus: {
+        boxShadow: 'none'
+      },
+      _active: {
+        color: 'black',
+        bg: 'transparent'
+      },
+      _disabled: {
+        opacity: 0.4,
+        cursor: 'not-allowed'
+      },
+      _hover: {
+        color: 'black'
+      }
+    }
+  }
+};
+
+var _default = (0, _merge.default)(_theme.default.components.Tabs, {
+  variants: variants
+});
+
+exports.default = _default;

package/dist/components/Text/Text.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@chakra-ui/react");
+
+var _options = _interopRequireDefault(require("./options"));
+
+var _Text = require("./Text.styles");
+
+var _combineAsWithVariant = _interopRequireDefault(require("./combineAsWithVariant"));
+
+var _excluded = ["as", "variant"];
+var Text = (0, _react2.forwardRef)(function (_ref, ref) {
+  var as = _ref.as,
+      variant = _ref.variant,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_react2.Text, (0, _extends2.default)({
+    variant: variant,
+    as: as
+  }, (0, _combineAsWithVariant.default)({
+    as: as,
+    variant: variant
+  }), props, {
+    ref: ref
+  }));
+});
+Text.defaultProps = {
+  as: 'p',
+  variant: 'body'
+};
+var _default = Text;
+exports.default = _default;