@pareto-engineering/design-system 0.0.1-alpha.8 → 0.0.4-testing-id.0

package/dist/cjs/b/Page/common/PageHelmet/PageHelmet.js

@@ -4,23 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _reactHelmet = require("react-helmet");
-
 var _a = require("../../../../a");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+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; }
+function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 var helmetMap = [{
   variables: ['robots'],
   render: v => /*#__PURE__*/React.createElement("meta", {
@@ -30,9 +22,12 @@ var helmetMap = [{
   })
 }, {
   variables: ['title_tag', 'title'],
-  render: v => /*#__PURE__*/React.createElement("title", {
-    key: "title_tag"
-  }, v)
+  render: (v, c) => {
+    var _c$SITE;
+    return /*#__PURE__*/React.createElement("title", {
+      key: "title_tag"
+    }, "\n          ".concat(v, "\n          ").concat(((_c$SITE = c.SITE) === null || _c$SITE === void 0 ? void 0 : _c$SITE.TITLE_SUFFIX) && c.SITE.TITLE_SUFFIX, "\n        "));
+  }
 }, {
   variables: ['meta_description'],
   render: v => /*#__PURE__*/React.createElement("meta", {
@@ -42,15 +37,18 @@ var helmetMap = [{
   })
 }, {
   variables: ['canonical'],
-  render: (v, c) => c.SITE_CANONICAL ? /*#__PURE__*/React.createElement("link", {
-    rel: "canonical",
-    href: "".concat(c.SITE_CANONICAL).concat(v),
-    key: "canonical"
-  }) : /*#__PURE__*/React.createElement("link", {
-    rel: "canonical",
-    href: v,
-    key: "canonical"
-  })
+  render: (v, c) => {
+    var _c$SITE2, _c$SITE3;
+    return (_c$SITE2 = c.SITE) !== null && _c$SITE2 !== void 0 && _c$SITE2.CANONICAL ? /*#__PURE__*/React.createElement("link", {
+      rel: "canonical",
+      href: "".concat((_c$SITE3 = c.SITE) === null || _c$SITE3 === void 0 ? void 0 : _c$SITE3.CANONICAL).concat(v),
+      key: "canonical"
+    }) : /*#__PURE__*/React.createElement("link", {
+      rel: "canonical",
+      href: v,
+      key: "canonical"
+    });
+  }
 }, {
   variables: ['twitter_title', 'title', 'title_tag'],
   render: v => /*#__PURE__*/React.createElement("meta", {
@@ -105,36 +103,35 @@ var helmetMap = [{
   })
 }, {
   variables: ['og_url', 'canonical'],
-  render: (v, c) => c.SITE_CANONICAL ? /*#__PURE__*/React.createElement("meta", {
-    property: "og:url",
-    content: "".concat(c.SITE_CANONICAL, "/").concat(v),
-    key: "og_url"
-  }) : /*#__PURE__*/React.createElement("meta", {
-    property: "og:url",
-    content: v,
-    key: "og_url"
-  })
+  render: (v, c) => {
+    var _c$SITE4, _c$SITE5;
+    return (_c$SITE4 = c.SITE) !== null && _c$SITE4 !== void 0 && _c$SITE4.CANONICAL ? /*#__PURE__*/React.createElement("meta", {
+      property: "og:url",
+      content: "".concat((_c$SITE5 = c.SITE) === null || _c$SITE5 === void 0 ? void 0 : _c$SITE5.CANONICAL).concat(v),
+      key: "og_url"
+    }) : /*#__PURE__*/React.createElement("meta", {
+      property: "og:url",
+      content: v,
+      key: "og_url"
+    });
+  }
 }];
-
-var PageHelmet = (_ref) => {
-  var props = _extends({}, _ref);
-
+var PageHelmet = _ref => {
+  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
   // const intl = useIntl()
-  var context = (0, _a.useSite)();
-  var HelmetContent = (0, React.useMemo)(() => helmetMap.reduce(
-  /* eslint-disable no-unused-vars -- TODO add test or ssr mode */
+  var context = (0, _a.useApp)();
+  var HelmetContent = (0, React.useMemo)(() => helmetMap.reduce( /* eslint-disable no-unused-vars -- TODO add test or ssr mode */
   (a, _ref2) => {
     var {
       variables,
       render,
       test
     } = _ref2;
-
     /* eslint-enable no-unused-vars */
     var current;
     var content = '';
-    /* eslint-disable no-restricted-syntax -- we need to be able to break the loop */
 
+    /* eslint-disable no-restricted-syntax -- we need to be able to break the loop */
     for (var key in variables) {
       if (props[variables[key]]) {
         content = props[variables[key]];
@@ -142,34 +139,31 @@ var PageHelmet = (_ref) => {
       }
     }
     /* eslint-enable no-restricted-syntax */
+
     // TODO Add SSR mode
     // if ((typeof test === 'undefined') || (test && content.length)) {
-
-
     if (content.length) {
       // if content is an object, then its a message and we need to render it as a string first
       // const stringContent = typeof content === 'string' ? content : intl.formatMessage(content)
       // const stringContent = typeof content === 'string' ? content : intl.formatMessage(content)
-      var stringContent = content; // console.log(stringContent, content)
-
+      var stringContent = content;
+      // console.log(stringContent, content)
       current = render(stringContent, context);
     }
-
     if (current) {
       a.push(current);
     }
-
     return a;
   }, []), [props, context]);
   return /*#__PURE__*/React.createElement(_reactHelmet.Helmet, null, HelmetContent);
 };
-
 PageHelmet.propTypes = {
   robots: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]).isRequired,
   title_tag: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   canonical: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   meta_description: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
+  main_image: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   twitter_title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   twitter_description: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
   twitter_image: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),

package/dist/cjs/b/Page/common/PageHelmet/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "PageHelmet", {
     return _PageHelmet.default;
   }
 });
-
 var _PageHelmet = _interopRequireDefault(require("./PageHelmet"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/b/Page/common/Section/Section.js

@@ -4,40 +4,35 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
-
+var _a = require("../../../../a");
 var _usePage = _interopRequireDefault(require("../../usePage"));
-
+var _excluded = ["id", "className", "style", "children", "backgroundShape", "backgroundGradient", "backgroundGradientHeight", "backgroundVerticalAlign", "backgroundHorizontalAlign", "backgroundHeight", "backgroundOverflow"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+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; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-// Local Definitions
 var baseClassName = _bem.default.base;
 var componentClassName = 'section';
-
-var Section = (_ref) => {
+var Section = _ref => {
   var {
-    id: userId,
-    className: userClassName,
-    style,
-    children
-  } = _ref,
-      otherProps = _objectWithoutProperties(_ref, ["id", "className", "style", "children"]);
-
+      id: userId,
+      className: userClassName,
+      style,
+      children,
+      backgroundShape,
+      backgroundGradient,
+      backgroundGradientHeight,
+      backgroundVerticalAlign,
+      backgroundHorizontalAlign,
+      backgroundHeight,
+      backgroundOverflow
+    } = _ref,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
   var {
     id: pageId
   } = (0, _usePage.default)();
@@ -46,31 +41,64 @@ var Section = (_ref) => {
     id: sectionId,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
     style: style
-  }, otherProps), children);
+  }, otherProps), children, backgroundShape && /*#__PURE__*/React.createElement(_a.Shapes, {
+    verticalAlign: backgroundVerticalAlign,
+    horizontalAlign: backgroundHorizontalAlign,
+    overflow: backgroundOverflow,
+    height: backgroundHeight,
+    shape: backgroundShape
+  }), backgroundGradient && /*#__PURE__*/React.createElement(_a.BackgroundGradient, {
+    height: backgroundGradientHeight
+  }));
 };
-
 Section.propTypes = {
   /**
    * The HTML id for this element
    */
   id: _propTypes.default.string,
-
   /**
    * The HTML class names for this element
    */
   className: _propTypes.default.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: _propTypes.default.objectOf(_propTypes.default.string),
-
   /**
    *  The children JSX
    */
-  children: _propTypes.default.node
+  children: _propTypes.default.node,
+  /**
+   * The background shape to use for this section.
+   */
+  backgroundShape: _propTypes.default.oneOf(['triangle', 'ellipse', 'half-ellipse', 'half-ellipses', 'spiral', 'diamonds', 'circle', 'half-circle', 'ellipses', 'rectangles']),
+  /**
+   * The background vertical alingment to use for if the background shape is set.
+   */
+  backgroundVerticalAlign: _propTypes.default.oneOf(['flex-start', 'center', 'flex-end']),
+  /**
+   * The background horizontal alingment to use for if the background shape is set.
+   */
+  backgroundHorizontalAlign: _propTypes.default.oneOf(['flex-start', 'center', 'flex-end']),
+  /**
+   * The background height to use for if the background shape is set.
+   */
+  backgroundHeight: _propTypes.default.string,
+  /**
+   * The background overflow to use for if the background shape is set.
+   */
+  backgroundOverflow: _propTypes.default.oneOf(['visible', 'hidden', 'scroll']),
+  /**
+   * The background gradient to use for if the background gradient is set.
+   */
+  backgroundGradient: _propTypes.default.bool,
+  /**
+   * The background gradient height to use for if the background gradient is set.
+   */
+  backgroundGradientHeight: _propTypes.default.string
 };
-Section.defaultProps = {// someProp:false
+Section.defaultProps = {
+  // someProp:false
 };
 var _default = Section;
 exports.default = _default;

package/dist/cjs/b/Page/common/Section/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "Section", {
     return _Section.default;
   }
 });
-
 var _Section = _interopRequireDefault(require("./Section"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/b/Page/common/index.js

@@ -15,7 +15,5 @@ Object.defineProperty(exports, "Section", {
     return _Section.Section;
   }
 });
-
 var _PageHelmet = require("./PageHelmet");
-
 var _Section = require("./Section");

package/dist/cjs/b/Page/index.js

@@ -9,23 +9,19 @@ Object.defineProperty(exports, "Page", {
     return _Page.default;
   }
 });
-Object.defineProperty(exports, "usePage", {
+Object.defineProperty(exports, "PageContext", {
   enumerable: true,
   get: function get() {
-    return _usePage.default;
+    return _Context.default;
   }
 });
-Object.defineProperty(exports, "PageContext", {
+Object.defineProperty(exports, "usePage", {
   enumerable: true,
   get: function get() {
-    return _Context.default;
+    return _usePage.default;
   }
 });
-
 var _Page = _interopRequireDefault(require("./Page"));
-
 var _usePage = _interopRequireDefault(require("./usePage"));
-
 var _Context = _interopRequireDefault(require("./Context"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/b/Page/styles.scss

@@ -2,9 +2,15 @@
 
 @use "@pareto-engineering/bem";
 
-/*
+
 .#{bem.$base}.page{
+    .#{bem.$base}.section {
+        position: relative;
 
-} */
+        > *:not(:last-child) {
+            z-index: 1;
+        }
+    }
+}
 
 

package/dist/cjs/b/Page/usePage.js

@@ -4,13 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _Context = _interopRequireDefault(require("./Context"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = () => (0, _react.useContext)(_Context.default);
-
 exports.default = _default;

package/dist/cjs/b/QuestionDropdown/QuestionDropdown.js

@@ -4,108 +4,101 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
+var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
-
+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; }
 // Component-level imports
 // import('./styles.scss')
+
 // Helper Definition
 var baseClassName = _bem.default.base;
 var componentClassName = 'question-dropdown';
+
 /**
  * The question dropdown is used for the FAQ section. <br />
  * If `isFAQSchema=true`, make sure to remember to add the appropriate itemscope and
  * itemtype attributes to the root of the page that includes the FAQ component
  */
-
-var QuestionDropdown = (_ref) => {
+var QuestionDropdown = _ref => {
   var {
     id,
     className: userClassName,
     style,
     question,
     children,
-    isFAQSchema // ...otherProps
-
+    isFAQSchema,
+    defaultIsOpen
+    // ...otherProps
   } = _ref;
-  (0, _react.useLayoutEffect)(() => {
+  (0, React.useLayoutEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
   }, []);
-  var [isOpen, setIsOpen] = (0, _react.useState)(false);
-
+  var [isOpen, setIsOpen] = (0, React.useState)(defaultIsOpen);
   var toggleOpen = () => setIsOpen(!isOpen);
-
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName, isOpen && 'open'].filter(e => e).join(' '),
     style: style,
     itemScope: isFAQSchema // if isFAQSchema is false, should be undefined
     ,
     itemProp: isFAQSchema && 'mainEntity',
-    itemType: isFAQSchema && 'http://schema.org/Question' // {...otherProps}
-
-  }, /*#__PURE__*/_react.default.createElement("button", {
-    type: "button",
+    itemType: isFAQSchema && 'http://schema.org/Question'
+    // {...otherProps}
+  }, /*#__PURE__*/React.createElement("div", {
+    tabIndex: 0,
+    role: "button",
     className: "accordion",
     onClick: toggleOpen,
-    isGhost: true
-  }, /*#__PURE__*/_react.default.createElement("span", {
+    onKeyDown: toggleOpen
+  }, /*#__PURE__*/React.createElement("span", {
     className: "caret"
-  }, "^"), /*#__PURE__*/_react.default.createElement("div", {
+  }, "^"), /*#__PURE__*/React.createElement("div", {
     className: "question-content",
     itemProp: isFAQSchema && 'name'
-  }, question)), /*#__PURE__*/_react.default.createElement("div", {
+  }, question)), /*#__PURE__*/React.createElement("div", {
     className: "answer-content",
     itemProp: isFAQSchema && 'acceptedAnswer',
     itemType: isFAQSchema && 'https://schema.org/Answer'
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "answer-text",
     itemProp: isFAQSchema && 'text'
   }, children)));
 };
-
 QuestionDropdown.propTypes = {
   /**
    * The HTML id for this element
    */
   id: _propTypes.default.string,
-
   /**
    * The HTML class names for this element
    */
   className: _propTypes.default.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: _propTypes.default.objectOf(_propTypes.default.string),
-
   /**
    *  Any children of the question, such as answer blocks
    */
   children: _propTypes.default.node.isRequired,
-
   /**
    *  Question to be answered
    */
   question: _propTypes.default.string.isRequired,
-
   /**
    *  Whether element is part of SEO schema
    */
-  isFAQSchema: _propTypes.default.bool
+  isFAQSchema: _propTypes.default.bool,
+  /**
+   * Whether the question drop down should be opened by default
+   */
+  defaultIsOpen: _propTypes.default.bool
 };
-QuestionDropdown.defaultProps = {// someProp:false
+QuestionDropdown.defaultProps = {
+  defaultIsOpen: false
 };
 var _default = QuestionDropdown;
 exports.default = _default;

package/dist/cjs/b/QuestionDropdown/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "QuestionDropdown", {
     return _QuestionDropdown.default;
   }
 });
-
 var _QuestionDropdown = _interopRequireDefault(require("./QuestionDropdown"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/b/QuestionDropdown/styles.scss

@@ -4,7 +4,7 @@
 
 //make all colors as vars
 
-$border-color: var(--dark-background);
+$border-color: var(--dark-background1);
 $border-width: 2px;
 $button-background-color: transparent;
 $button-background-color-hover: var(--light-accent3);
@@ -19,7 +19,7 @@ $transition-time-answer: 1.5s;
 .#{bem.$base}.question-dropdown {
   width: 100%;
 
-  > button {
+  > .accordion {
     align-items: center;
     background-color: $button-background-color;
     border: none;
@@ -72,7 +72,7 @@ $transition-time-answer: 1.5s;
   &.open {
     background-color: $button-background-color-hover;
 
-    > button {
+    > .accordion {
       .caret {
         font-size: $caret-font-size;
         transform: scale(1.2, .6) rotate(360deg);

package/dist/cjs/b/Segment/Segment.js

@@ -4,34 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
-
+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; }
 // Component-level imports
-Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss"))); // Helper Definition
+Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
 
+// Helper Definition
 var baseClassName = _bem.default.base;
 var componentClassName = 'segment';
-
-var Segment = (_ref) => {
+var Segment = _ref => {
   var {
     id,
     className: userClassName,
     style,
     children,
     title,
-    footer // ...otherProps
+    footer
 
+    // ...otherProps
   } = _ref;
   return /*#__PURE__*/React.createElement("div", {
     id: id,
@@ -41,39 +35,34 @@ var Segment = (_ref) => {
     className: "s1 title"
   }, title)), /*#__PURE__*/React.createElement("main", null, children), footer && /*#__PURE__*/React.createElement("footer", null, footer));
 };
-
 Segment.propTypes = {
   /**
    * The HTML id for this element
    */
   id: _propTypes.default.string,
-
   /**
    * The HTML class names for this element
    */
   className: _propTypes.default.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: _propTypes.default.objectOf(_propTypes.default.string),
-
   /**
    *  The children JSX
    */
   children: _propTypes.default.node,
-
   /**
    * The title of the segment
    */
   title: _propTypes.default.string.isRequired,
-
   /**
    * The optional footer of the segment.
    */
   footer: _propTypes.default.node
 };
-Segment.defaultProps = {// someProp:false
+Segment.defaultProps = {
+  // someProp:false
 };
 var _default = Segment;
 exports.default = _default;