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

package/lib/styles/variants/codeView.js

@@ -0,0 +1,159 @@
+var theme = {
+  plain: {
+    color: '#545454',
+    background: 'none',
+    lineHeight: 1.5,
+    tabSize: 4,
+    fontFamily: '"Roboto Mono", "Lucida Console", Courier, monospace'
+  },
+  styles: [{
+    types: ['prolog', 'constant', 'builtin'],
+    style: {
+      color: 'rgb(189, 147, 249)'
+    }
+  }, {
+    types: ['inserted', 'function'],
+    style: {
+      color: 'rgb(80, 250, 123)'
+    }
+  }, {
+    types: ['deleted'],
+    style: {
+      color: 'rgb(255, 85, 85)'
+    }
+  }, {
+    types: ['changed'],
+    style: {
+      color: 'rgb(255, 184, 108)'
+    }
+  }, {
+    types: ['punctuation', 'symbol'],
+    style: {
+      color: 'rgb(248, 248, 242)'
+    }
+  }, {
+    types: ['string', 'char', 'tag', 'selector'],
+    style: {
+      color: 'rgb(255, 121, 198)'
+    }
+  }, {
+    types: ['keyword', 'variable'],
+    style: {
+      color: 'rgb(189, 147, 249)',
+      fontStyle: 'italic'
+    }
+  }, {
+    types: ['comment'],
+    style: {
+      color: 'rgb(98, 114, 164)'
+    }
+  }, {
+    types: ['attr-name'],
+    style: {
+      color: 'rgb(241, 250, 140)'
+    }
+  }, {
+    types: ['comment', 'prolog', 'doctype', 'cdata'],
+    style: {
+      color: '#696969'
+    }
+  }, {
+    types: ['punctuation'],
+    style: {
+      color: '#545454'
+    }
+  }, {
+    types: ['property', 'tag', 'constant', 'symbol', 'deleted'],
+    style: {
+      color: '#007299'
+    }
+  }, {
+    types: ['boolean', 'number', 'operator', 'entity', 'url', 'variable'],
+    style: {
+      color: '#008000'
+    }
+  }, {
+    types: ['selector', 'attr-name', 'char', 'builtin', 'inserted', 'atrule', 'attr-value', 'function', 'string'],
+    style: {
+      color: '#aa5d00'
+    }
+  }, {
+    types: ['keyword', 'regex', 'important'],
+    style: {
+      color: '#d91e18'
+    }
+  }, {
+    types: ['keyword'],
+    style: {
+      fontStyle: 'normal'
+    }
+  }]
+};
+var wrapper = {
+  bg: 'accent.99',
+  border: '1px solid',
+  borderColor: 'accent.95',
+  width: 400,
+  height: 200,
+  my: 5,
+  overflow: 'auto',
+  alignItems: 'center',
+  '&.is-focused, &:focus': {
+    boxShadow: 'focus',
+    outline: 'none'
+  },
+  pre: {
+    backgroundColor: 'transparent',
+    m: 0,
+    p: 10,
+    pr: 0,
+    height: '100%',
+    width: '100%',
+    overflowX: 'hidden',
+    overflowY: 'auto',
+    fontFamily: 'standard',
+    fontSize: 'sm',
+    '& .token-line': {
+      display: 'block',
+      alignItems: 'center',
+      '& .token': {
+        whiteSpace: 'pre-wrap',
+        wordBreak: 'break-all'
+      }
+    }
+  },
+  '&.has-no-copy-button': {
+    pre: {
+      p: 10
+    }
+  },
+  '&.has-line-numbers': {
+    pre: {
+      p: '0 10px 0 0',
+      overflow: 'auto',
+      '& .token-line:first-of-type *': {
+        pt: 10
+      },
+      '& .token-line': {
+        display: 'flex',
+        '& .token': {
+          whiteSpace: 'pre'
+        }
+      }
+    }
+  }
+};
+var lineNo = {
+  display: 'table-cell',
+  userSelect: 'none',
+  p: 5,
+  m: '0 10px 0 0',
+  bg: 'accent.30',
+  minWidth: 26,
+  color: 'white'
+};
+export default {
+  theme: theme,
+  wrapper: wrapper,
+  lineNo: lineNo
+};

package/lib/styles/variants/collapsiblePanel.js

@@ -0,0 +1,80 @@
+var collapsiblePanelContainer = {
+  pr: 'sm',
+  minHeight: '80vh',
+  '>div': {
+    visibility: 'hidden',
+    width: 0,
+    transition: 'width .3s ease'
+  },
+  '&.is-open>div': {
+    visibility: 'visible',
+    width: '300px'
+  }
+};
+var collapsiblePanelContent = {
+  bg: 'accent.99',
+  fontSize: 'sm',
+  height: '100%',
+  width: '300px',
+  '&.is-focused': {
+    borderColor: 'accent.80',
+    boxShadow: 'focus',
+    outline: 'none'
+  },
+  '& div': {
+    alignItems: 'center',
+    display: 'flex',
+    minHeight: '45px',
+    padding: '3px',
+    width: '100%',
+    justifyContent: 'space-between'
+  }
+};
+var collapsiblePanelContainerTitle = {
+  alignContent: 'center',
+  fontWeight: '500',
+  minHeight: '40px',
+  alignItems: 'center',
+  padding: '0 10px !important',
+  flexWrap: 'wrap',
+  maxWidth: 'max-content !important',
+  margin: '0',
+  width: '0',
+  '.is-open &': {
+    width: '300px'
+  }
+};
+var collapsiblePanelBadge = {
+  borderRadius: '5px',
+  display: 'flex',
+  height: '17px',
+  justifyContent: 'center',
+  minWidth: 'max-content',
+  position: 'relative',
+  pb: '0px !important',
+  pr: '3px !important',
+  pl: '3px !important',
+  alignItems: 'center',
+  fontWeight: 500,
+  '.is-open &.title-badge': {
+    minWidth: '0',
+    display: 'flex',
+    transition: 'min-width .3s ease',
+    width: 'max-content'
+  },
+  '&.title-badge': {
+    display: 'none',
+    width: '0'
+  }
+};
+var collapsiblePanellItem = {
+  minHeight: '45px',
+  margin: 'auto'
+};
+export default {
+  collapsiblePanelContainer: collapsiblePanelContainer,
+  collapsiblePanelContent: collapsiblePanelContent,
+  collapsiblePanelContainerTitle: collapsiblePanelContainerTitle,
+  collapsiblePanelBadge: collapsiblePanelBadge,
+  collapsiblePanellItem: collapsiblePanellItem
+};

package/lib/styles/variants/imageUpload.js

@@ -0,0 +1,19 @@
+var hoveredPreview = {
+  wrapper: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    position: 'absolute'
+  },
+  shaded: {
+    opacity: 0.3,
+    backgroundColor: '#000',
+    width: '100%',
+    height: '100%',
+    position: 'absolute',
+    borderRadius: 2
+  }
+};
+export default {
+  hoveredPreview: hoveredPreview
+};

package/lib/styles/variants/images.js

@@ -0,0 +1,9 @@
+var avatar = {
+  cursor: 'pointer',
+  borderRadius: '100%',
+  width: '35px',
+  height: '35px'
+};
+export default {
+  avatar: avatar
+};

package/lib/styles/variants/index.js

@@ -0,0 +1,6 @@
+export { default as variants } from './variants';
+export { default as buttons } from './buttons';
+export { default as bidirectionalIconButton } from './bidirectionalIconButton';
+export { default as images } from './images';
+export { default as links } from './links';
+export * from './text';

package/lib/styles/variants/links.js

@@ -0,0 +1,46 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/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) { _defineProperty(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 app = {
+  color: 'active',
+  fontFamily: 'standard',
+  fontSize: 'md',
+  textDecoration: 'none',
+  outline: 'none',
+  '&.is-hovered': {
+    textDecoration: 'underline'
+  },
+  '&.is-focused': {
+    textDecoration: 'underline'
+  },
+  '&.is-pressed': {
+    color: 'accent.40',
+    textDecoration: 'underline'
+  },
+  '&.is-disabled': {
+    pointerEvents: 'none'
+  }
+};
+
+var web = _objectSpread(_objectSpread({}, app), {}, {
+  textDecoration: 'underline',
+  '&:visited': {
+    color: 'decorative.7'
+  }
+});
+
+export default {
+  app: app,
+  web: web
+};

package/lib/styles/variants/listBox.js

@@ -0,0 +1,40 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/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) { _defineProperty(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; }
+
+import { text } from '../variants/text';
+var listBox = {
+  outline: 'none'
+};
+listBox.option = _objectSpread(_objectSpread({}, text.base), {}, {
+  px: 'md',
+  py: 'sm',
+  alignItems: 'center',
+  outline: 'none',
+  wordBreak: 'break-word',
+  cursor: 'pointer',
+  '&.is-selected': _objectSpread(_objectSpread({}, text.inputValue), {}, {
+    pl: 0
+  }),
+  '&.is-focused': {
+    color: 'white',
+    bg: 'active'
+  }
+});
+listBox.selectField = {
+  maxHeight: '200px',
+  overflow: 'auto',
+  pl: 0,
+  outline: 'none'
+};
+export default listBox;

package/lib/styles/variants/loader.js

@@ -0,0 +1,75 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
+import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/esm/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _context, _context2, _context3, _context4, _context5;
+
+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 _context6, _context7; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context6 = ownKeys(Object(source), !0)).call(_context6, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context7 = ownKeys(Object(source))).call(_context7, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import { keyframes } from '@emotion/react';
+var container = {
+  color: 'currentColor',
+  fontSize: '1em'
+};
+var withinInput = {
+  color: 'neutral.60',
+  fontSize: '6px',
+  alignItems: 'center',
+  marginRight: 'xs'
+};
+var withinListbox = {
+  color: 'neutral.60',
+  fontSize: '6px',
+  padding: 'md',
+  alignItems: 'center',
+  justifyContent: 'center'
+};
+var withinListView = {
+  color: 'neutral.60',
+  padding: 'md',
+  alignItems: 'center',
+  justifyContent: 'center'
+};
+var pulse = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n   0% {\n        opacity: 0;\n    }\n\n   50% {\n        opacity: 0;\n    }\n   80% {\n        opacity: 1;\n    }\n   100% {\n        opacity: 0;\n    }\n\n"], ["\n  \\ 0% {\n        opacity: 0;\n    }\n\n  \\ 50% {\n        opacity: 0;\n    }\n  \\ 80% {\n        opacity: 1;\n    }\n  \\ 100% {\n        opacity: 0;\n    }\n\n"])));
+var wait = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n   0% { opacity: 0; }\n   100% { opacity: 0; }\n"], ["\n  \\ 0% { opacity: 0; }\n  \\ 100% { opacity: 0; }\n"])));
+var animationSettings = '1s ease-out infinite';
+var dot = {
+  borderRadius: '100%',
+  bg: 'currentColor',
+  height: '1em',
+  width: '1em',
+  margin: '0.3em',
+  display: 'block'
+};
+
+var dotLeft = _objectSpread(_objectSpread({}, dot), {}, {
+  animation: _concatInstanceProperty(_context = "".concat(pulse, " ")).call(_context, animationSettings)
+});
+
+var dotCenter = _objectSpread(_objectSpread({}, dot), {}, {
+  animation: _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = "".concat(wait, " 0.2s, ")).call(_context3, pulse, " ")).call(_context2, animationSettings, " 0.2s")
+});
+
+var dotRight = _objectSpread(_objectSpread({}, dot), {}, {
+  animation: _concatInstanceProperty(_context4 = _concatInstanceProperty(_context5 = "".concat(wait, " 0.4s, ")).call(_context5, pulse, " ")).call(_context4, animationSettings, " 0.4s")
+});
+
+export default {
+  dotLeft: dotLeft,
+  dotCenter: dotCenter,
+  dotRight: dotRight,
+  container: container,
+  withinInput: withinInput,
+  withinListbox: withinListbox,
+  withinListView: withinListView
+};

package/lib/styles/variants/menu.js

@@ -0,0 +1,10 @@
+export default {
+  padding: 0,
+  margin: 0,
+  listStyle: 'none',
+  maxWidth: 250,
+  outline: 'none',
+  overflow: 'hidden',
+  minWidth: '90px',
+  borderRadius: 4
+};

package/lib/styles/variants/menuItem.js

@@ -0,0 +1,26 @@
+var item = {
+  bg: 'transparent',
+  padding: '10px 10px',
+  outline: 'none',
+  cursor: 'pointer',
+  '&.is-focused, &.is-selected, &.is-pressed': {
+    color: 'white',
+    bg: 'active',
+    '> *': {
+      color: 'white'
+    }
+  },
+  '&.is-pressed': {
+    bg: 'accent.20'
+  }
+};
+var separator = {
+  padding: '0px',
+  '& > [role="separator"]': {
+    margin: '0px'
+  }
+};
+export default {
+  item: item,
+  separator: separator
+};

package/lib/styles/variants/messages.js

@@ -0,0 +1,43 @@
+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'
+  }
+};
+export default {
+  wrapper: wrapper,
+  transition: transition,
+  item: item
+};

package/lib/styles/variants/modal.js

@@ -0,0 +1,65 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/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) { _defineProperty(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; }
+
+import { text } from '../variants/text';
+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.title), {}, {
+  mr: 'sm',
+  fontWeight: 3,
+  '.is-dark-mode &': {
+    color: 'white'
+  }
+});
+
+export default {
+  closeIcon: closeIcon,
+  container: container,
+  content: content,
+  dark: dark,
+  title: title
+};

package/lib/styles/variants/navBar.js

@@ -0,0 +1,56 @@
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/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) { _defineProperty(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; }
+
+import accordion from './accordion';
+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.accordionGridBody), {}, {
+  pl: '0'
+});
+
+export default {
+  container: container,
+  itemHeaderContainer: itemHeaderContainer,
+  sectionContainer: sectionContainer,
+  sectionBody: sectionBody
+};