@pingux/astro 1.27.0-alpha.25 → 1.27.0-alpha.26

package/lib/cjs/styles/variants/messages.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+var wrapper = {
+  position: 'absolute',
+  right: 'lg',
+  bottom: 'lg',
+  left: 'lg',
+  alignItems: 'flex-end',
+  pointerEvents: 'none'
+};
+var transition = {
+  transition: 'opacity 200ms, max-height 200ms',
+  opacity: 1,
+  '&.is-hidden': {
+    opacity: 0
+  }
+};
+var item = {
+  maxWidth: 400,
+  pointerEvents: 'all',
+  mb: 'md',
+  p: 'md',
+  wordBreak: 'break-word',
+  alignItems: 'center',
+  bg: 'neutral.95',
+  color: 'neutral.10',
+  borderRadius: 4,
+  '&.is-success, > .is-success': {
+    bg: 'success.light',
+    color: 'success.dark'
+  },
+  '&.is-warning, > .is-warning': {
+    bg: 'warning.light',
+    color: 'warning.dark'
+  },
+  '&.is-error, > .is-error': {
+    bg: 'critical.light',
+    color: 'critical.dark'
+  }
+};
+var _default = {
+  wrapper: wrapper,
+  transition: transition,
+  item: item
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/modal.js

@@ -0,0 +1,85 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _text = require("../variants/text");
+
+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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var closeIcon = {
+  color: 'neutral.40'
+};
+var container = {
+  position: 'fixed',
+  zIndex: 100,
+  top: 0,
+  left: 0,
+  bottom: 0,
+  right: 0,
+  background: '#00000040',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center'
+};
+var content = {
+  position: 'relative',
+  outline: 'none',
+  background: 'white',
+  color: 'black',
+  pt: 'md',
+  pr: 'lg',
+  pb: 'lg',
+  pl: 'lg',
+  maxWidth: '400px',
+  boxShadow: 'standard',
+  borderRadius: 3,
+  '.is-dark-mode &': {
+    color: 'white',
+    bg: 'accent.5'
+  }
+};
+
+var dark = _objectSpread({}, container);
+
+var title = _objectSpread(_objectSpread({}, _text.text.title), {}, {
+  mr: 'sm',
+  fontWeight: 3,
+  '.is-dark-mode &': {
+    color: 'white'
+  }
+});
+
+var _default = {
+  closeIcon: closeIcon,
+  container: container,
+  content: content,
+  dark: dark,
+  title: title
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/navBar.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _accordion = _interopRequireDefault(require("./accordion"));
+
+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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var container = {
+  height: '100%',
+  width: '230px',
+  position: 'absolute',
+  zIndex: '1',
+  top: '0',
+  left: '0',
+  backgroundColor: 'accent.20',
+  overflowY: 'hidden'
+};
+var itemHeaderContainer = {
+  flexGrow: 1,
+  alignItems: 'center',
+  maxWidth: '230px',
+  padding: '10px 15px 10px 15px',
+  cursor: 'pointer',
+  minHeight: '40px',
+  fontWeight: 0,
+  fontSize: '16px',
+  '&.is-selected': {
+    backgroundColor: 'accent.5',
+    boxShadow: 'inset 2px 0 0 0 white'
+  }
+};
+var sectionContainer = {
+  pt: '10px',
+  height: '100%',
+  maxHeight: '100%',
+  overflowY: 'overlay !important'
+};
+
+var sectionBody = _objectSpread(_objectSpread({}, _accordion["default"].accordionGridBody), {}, {
+  pl: '0'
+});
+
+var _default = {
+  container: container,
+  itemHeaderContainer: itemHeaderContainer,
+  sectionContainer: sectionContainer,
+  sectionBody: sectionBody
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/numberField.js

@@ -0,0 +1,62 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _input = require("../forms/input");
+
+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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var sharedStyles = {
+  WebkitAppearance: 'none',
+  margin: 0
+};
+var noDefaultArrows = {
+  'input::-webkit-outer-spin-button': _objectSpread({}, sharedStyles),
+  'input::-webkit-inner-spin-button': _objectSpread({}, sharedStyles),
+  'input[type=number]': {
+    MozAppearance: 'textfield'
+  }
+};
+
+var arrowsWrapper = _objectSpread({
+  display: 'flex',
+  justifyContent: 'center',
+  position: 'relative'
+}, _input.input.container);
+
+var arrows = {
+  position: 'absolute',
+  right: '10px'
+};
+var _default = {
+  arrowsWrapper: arrowsWrapper,
+  arrows: arrows,
+  noDefaultArrows: noDefaultArrows
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/overlayPanel.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+var overlayPanel = {
+  position: 'fixed',
+  overflowY: 'scroll',
+  zIndex: 10,
+  top: 0,
+  bottom: 0,
+  right: '-100%',
+  background: 'white',
+  alignItems: 'center',
+  justifyContent: 'center',
+  borderLeft: '1px solid',
+  borderLeftColor: 'neutral.80',
+  boxShadow: '-2px 0px 2px 1px rgba(37, 55, 70, 0.15)',
+  p: '25px',
+  transition: 'right 500ms',
+  maxWidth: '100%',
+  '&.is-small': {
+    width: '400px'
+  },
+  '&.is-medium': {
+    width: '550px'
+  },
+  '&.is-large': {
+    width: '800px'
+  },
+  '&.is-full': {
+    width: 'container.full'
+  },
+  '&.is-open': {
+    display: 'flex !important',
+    right: 0
+  }
+};
+var overlayPanelInner = {
+  position: 'absolute',
+  zIndex: 9,
+  bottom: 0,
+  right: 0,
+  background: 'white',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  boxShadow: '0px 2px 4px 0px rgb(110 110 110 / 25%) inset',
+  minWidth: '50%',
+  maxWidth: '100%',
+  width: '100%',
+  height: '200px',
+  p: '25px',
+  backgroundColor: 'accent.99'
+};
+var overlayPanelBody = {
+  display: 'none',
+  height: '100%',
+  width: '100%',
+  '&.is-open': {
+    display: 'flex'
+  }
+};
+var _default = {
+  overlayPanel: overlayPanel,
+  overlayPanelBody: overlayPanelBody,
+  overlayPanelInner: overlayPanelInner
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/popoverMenu.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+var container = {
+  visibility: 'hidden',
+  position: 'relative',
+  bg: 'white',
+  color: 'neutral.10',
+  borderRadius: 4,
+  fontSize: 'md',
+  lineHeight: 1.4,
+  outline: 'none',
+  transitionProperty: 'transform,visibility,opacity',
+  'WebkitBoxShadow': '0px 0px 12px 2px #0000002e',
+  'MozBoxShadow': '0px 0px 12px 2px #0000002e',
+  'boxShadow': '0px 0px 12px 2px #0000002e',
+  '&.is-dark-mode': {
+    color: 'white',
+    bg: 'accent.20',
+    '&[data-popover-placement^=top] > [data-popover-arrow="arrow"]:before': {
+      borderTopColor: 'accent.20'
+    },
+    '&[data-popover-placement^=bottom] > [data-popover-arrow="arrow"]:before': {
+      borderBottomColor: 'accent.20'
+    },
+    '&[data-popover-placement^=left] > [data-popover-arrow="arrow"]:before': {
+      borderLeftColor: 'accent.20'
+    },
+    '&[data-popover-placement^=right] > [data-popover-arrow="arrow"]:before': {
+      borderRightColor: 'accent.20'
+    }
+  },
+  '&[data-popover-placement^=top] > [data-popover-arrow="arrow"]': {
+    bottom: 0
+  },
+  '&[data-popover-placement^=top] > [data-popover-arrow="arrow"]:before': {
+    left: '50%',
+    transform: 'translateX(-50%)',
+    borderWidth: '8px 8px 0',
+    borderTopColor: 'white',
+    transformOrigin: 'center top'
+  },
+  '&[data-popover-placement^=bottom] > [data-popover-arrow="arrow"]': {
+    top: 0
+  },
+  '&[data-popover-placement^=bottom] > [data-popover-arrow="arrow"]:before': {
+    top: '-8px',
+    left: '50%',
+    transform: 'translateX(-50%)',
+    borderWidth: '0 8px 8px',
+    borderBottomColor: 'white',
+    transformOrigin: 'center bottom'
+  },
+  '&[data-popover-placement^=left] > [data-popover-arrow="arrow"]': {
+    right: 0
+  },
+  '&[data-popover-placement^=left] > [data-popover-arrow="arrow"]:before': {
+    right: '-8px',
+    top: '50%',
+    transform: 'translateY(-50%)',
+    borderWidth: '8px 0 8px 8px',
+    borderLeftColor: 'white',
+    transformOrigin: 'center left'
+  },
+  '&[data-popover-placement^=right] > [data-popover-arrow="arrow"]': {
+    left: 0
+  },
+  '&[data-popover-placement^=right] > [data-popover-arrow="arrow"]:before': {
+    left: '-8px',
+    top: '50%',
+    transform: 'translateY(-50%)',
+    borderWidth: '8px 8px 8px 0',
+    borderRightColor: 'white',
+    transformOrigin: 'center right'
+  },
+  '&.is-open': {
+    visibility: 'visible'
+  }
+};
+var arrow = {
+  color: 'white',
+  '&:before': {
+    content: '""',
+    position: 'absolute',
+    borderColor: 'transparent',
+    borderStyle: 'solid'
+  }
+};
+var _default = {
+  arrow: arrow,
+  container: container
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/rockerbutton.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+var rockerContainer = {
+  alignItems: 'flex-start'
+};
+var rockerContainerInner = {
+  bg: 'accent.95',
+  border: '1px solid',
+  borderColor: 'accent.90',
+  boxShadow: 'standard',
+  borderRadius: '15px',
+  padding: '2px'
+};
+var _default = {
+  rockerContainer: rockerContainer,
+  rockerContainerInner: rockerContainerInner
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/separator.js

@@ -0,0 +1,64 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var base = {
+  bg: 'neutral.80',
+  width: '100%',
+  height: '1px',
+  my: '5px',
+  '&.is-vertical': {
+    width: '1px',
+    height: '100%',
+    mx: '5px'
+  }
+};
+
+var navBarSeparator = _objectSpread(_objectSpread({}, base), {}, {
+  width: '100%',
+  backgroundColor: 'neutral.60',
+  my: 0
+});
+
+var navBarSubtitleSeparator = _objectSpread(_objectSpread({}, base), {}, {
+  mt: '15px',
+  mb: '15px',
+  ml: '45px',
+  width: 'calc(100% - 60px)',
+  backgroundColor: 'neutral.60'
+});
+
+var _default = {
+  base: base,
+  navBarSeparator: navBarSeparator,
+  navBarSubtitleSeparator: navBarSubtitleSeparator
+};
+exports["default"] = _default;

package/lib/cjs/styles/variants/stepper.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+/** Tabs styles */
+var wrapper = {
+  width: '100%'
+};
+var tabs = {
+  outline: 'none',
+  borderBottom: 'none',
+  mb: 0,
+  width: '100%'
+};
+var tab = {
+  mb: 0,
+  mr: 0,
+  outline: 'none',
+  '&.is-focused': {
+    boxShadow: 'focus',
+    borderRadius: '50%'
+  },
+  '&:not(:first-of-type)': {
+    flex: 1,
+    maxWidth: 122
+  }
+};
+var tabLabel = {
+  mb: 0
+};
+var stepWrapper = {
+  alignItems: 'center'
+};
+/** Step styles */
+
+var stepBase = {
+  width: 32,
+  height: 32,
+  minWidth: 32,
+  minHeight: 32,
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  borderWidth: 1,
+  borderStyle: 'solid',
+  borderRadius: '50%',
+  fontSize: '17px',
+  fontWeight: 3,
+  cursor: 'pointer',
+  '&[aria-expanded="true"]': {
+    backgroundColor: 'active',
+    borderColor: 'active',
+    color: 'text.primaryLight'
+  }
+};
+var step = {
+  active: _objectSpread({
+    backgroundColor: 'accent.95',
+    borderColor: 'active',
+    color: 'active'
+  }, stepBase),
+  completed: _objectSpread({
+    backgroundColor: 'active',
+    borderColor: 'active',
+    color: 'text.primaryLight'
+  }, stepBase),
+  inactive: _objectSpread({
+    backgroundColor: 'white',
+    borderColor: 'neutral.80',
+    color: 'neutral.40'
+  }, stepBase)
+};
+/** Line styles */
+
+var line = {
+  alignSelf: 'center',
+  width: '100%',
+  maxWidth: '90px',
+  borderBottomWidth: 1,
+  borderBottomStyle: 'solid',
+  borderBottomColor: 'active',
+  '&.is-inactive': {
+    borderBottomStyle: 'dashed',
+    borderBottomColor: 'neutral.80'
+  }
+};
+var _default = {
+  wrapper: wrapper,
+  tabs: tabs,
+  tab: tab,
+  tabLabel: tabLabel,
+  stepWrapper: stepWrapper,
+  step: step,
+  line: line
+};
+exports["default"] = _default;