@pareto-engineering/design-system 2.0.0-alpha.9 → 3.0.0-alpha.22

package/dist/cjs/c/ContentSlides/common/Sidebar/Sidebar.js

@@ -4,41 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _a = require("../../../../a");
-
 var _b = require("../../../../b");
-
-var _bem = _interopRequireDefault(require("@pareto-engineering/bem"));
-
+var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _useContentSlides = _interopRequireDefault(require("../../useContentSlides"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 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; }
-
 /* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
+
 // const baseClassName = styleNames.base
+
 var componentClassName = 'sidebar';
+
 /**
  * This is the component description.
  */
-
 var Sidebar = _ref => {
   var {
     id,
     className: userClassName,
     style,
     header,
-    footer // ...otherProps
-
+    footer
+    // ...otherProps
   } = _ref;
   var {
     steps,
@@ -52,14 +45,15 @@ var Sidebar = _ref => {
   } = (0, _useContentSlides.default)();
   return /*#__PURE__*/React.createElement("nav", {
     id: id,
-    className: [// baseClassName,
+    className: [
+    // baseClassName,
+
     componentClassName, userClassName].filter(e => e).join(' '),
     style: style
   }, header ? /*#__PURE__*/React.createElement("header", null, header) : /*#__PURE__*/React.createElement("span", null), /*#__PURE__*/React.createElement("div", {
-    className: _bem.default.elementContent
+    className: _exports.default.elementContent
   }, /*#__PURE__*/React.createElement(_a.IconList, null, steps.map((step, i) =>
   /*#__PURE__*/
-
   /* eslint-disable no-nested-ternary -- bc of math inequality cases */
   React.createElement(_a.IconList.Item, {
     key: step.location,
@@ -68,39 +62,34 @@ var Sidebar = _ref => {
     className: [currentStepIndex === i ? 'x-heading' : i < currentStepIndex ? 'pointer x-paragraph xh-main2' : 'x-subtitle', 'c-x'].filter(e => e).join(' '),
     onClick: i < currentStepIndex ? () => setStepIndex(i) : undefined
   }, step.title)
-  /* eslint-enable no-nested-ternary */
-  ))), footer || true ? /*#__PURE__*/React.createElement("footer", null, footer, /*#__PURE__*/React.createElement(_b.ThemeSelector, {
+  /* eslint-enable no-nested-ternary */))), footer ? /*#__PURE__*/React.createElement("footer", null, footer, /*#__PURE__*/React.createElement(_b.ThemeSelector, {
     className: "x-heading"
   })) : /*#__PURE__*/React.createElement("span", null));
 };
-
 Sidebar.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 header JSX
    */
   header: _propTypes.default.node,
-
   /**
    *  The footer JSX
    */
   footer: _propTypes.default.node
 };
-Sidebar.defaultProps = {// someProp:false
+Sidebar.defaultProps = {
+  // someProp:false
 };
 var _default = Sidebar;
 exports.default = _default;

package/dist/cjs/c/ContentSlides/common/Sidebar/index.js

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

package/dist/cjs/c/ContentSlides/common/Slide/Slide.js

@@ -4,37 +4,32 @@ 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 _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _useContentSlides = _interopRequireDefault(require("../../useContentSlides"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 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; }
-
 /* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
+
 // const baseClassName = styleNames.base
+
 var componentClassName = 'slide';
+
 /**
  * This is the component description.
  */
-
 var Slide = _ref => {
   var {
     id,
     className: userClassName,
     style,
     children,
-    index // ...otherProps
-
+    index
+    // ...otherProps
   } = _ref;
   var {
     currentStepIndex
@@ -42,8 +37,9 @@ var Slide = _ref => {
   var isActive = currentStepIndex === index;
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [// baseClassName,
-    isActive && _bem.default.modifierActive, componentClassName, userClassName].filter(e => e).join(' '),
+    className: [
+    // baseClassName,
+    isActive && _exports.default.modifierActive, componentClassName, userClassName].filter(e => e).join(' '),
     style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: "wrapper"
@@ -51,34 +47,30 @@ var Slide = _ref => {
     className: "content"
   }, children)));
 };
-
 Slide.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 index of this slide
    */
   index: _propTypes.default.number
 };
-Slide.defaultProps = {// someProp:false
+Slide.defaultProps = {
+  // someProp:false
 };
 var _default = Slide;
 exports.default = _default;

package/dist/cjs/c/ContentSlides/common/Slide/index.js

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

package/dist/cjs/c/ContentSlides/common/index.js

@@ -3,35 +3,31 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Sidebar", {
+Object.defineProperty(exports, "HorizontalMenu", {
   enumerable: true,
   get: function get() {
-    return _Sidebar.Sidebar;
+    return _HorizontalMenu.HorizontalMenu;
   }
 });
-Object.defineProperty(exports, "HorizontalMenu", {
+Object.defineProperty(exports, "Navigator", {
   enumerable: true,
   get: function get() {
-    return _HorizontalMenu.HorizontalMenu;
+    return _Navigator.Navigator;
   }
 });
-Object.defineProperty(exports, "Slide", {
+Object.defineProperty(exports, "Sidebar", {
   enumerable: true,
   get: function get() {
-    return _Slide.Slide;
+    return _Sidebar.Sidebar;
   }
 });
-Object.defineProperty(exports, "Navigator", {
+Object.defineProperty(exports, "Slide", {
   enumerable: true,
   get: function get() {
-    return _Navigator.Navigator;
+    return _Slide.Slide;
   }
 });
-
 var _Sidebar = require("./Sidebar");
-
 var _HorizontalMenu = require("./HorizontalMenu");
-
 var _Slide = require("./Slide");
-
 var _Navigator = require("./Navigator");

package/dist/cjs/c/ContentSlides/index.js

@@ -9,23 +9,19 @@ Object.defineProperty(exports, "ContentSlides", {
     return _ContentSlides.default;
   }
 });
-Object.defineProperty(exports, "useContentSlides", {
+Object.defineProperty(exports, "ContentSlidesContext", {
   enumerable: true,
   get: function get() {
-    return _useContentSlides.default;
+    return _Context.default;
   }
 });
-Object.defineProperty(exports, "ContentSlidesContext", {
+Object.defineProperty(exports, "useContentSlides", {
   enumerable: true,
   get: function get() {
-    return _Context.default;
+    return _useContentSlides.default;
   }
 });
-
 var _ContentSlides = _interopRequireDefault(require("./ContentSlides"));
-
 var _useContentSlides = _interopRequireDefault(require("./useContentSlides"));
-
 var _Context = _interopRequireDefault(require("./Context"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/c/ContentSlides/styles.scss

@@ -1,8 +1,8 @@
 /* @pareto-engineering/generator-front 1.0.12 */
 
 @use "@pareto-engineering/bem";
-@use "@aztlan/stylebook/src/mixins";
-@use "@aztlan/stylebook/src/globals" as *;
+@use "@pareto-engineering/styles/src/mixins";
+@use "@pareto-engineering/styles/src/globals" as *;
 
 $class-sidebar:sidebar;
 $class-horizontal-menu:horizontal-menu;
@@ -14,7 +14,7 @@ $class-navigator:navigator;
 $default-sidebar-width:minmax(250px, 330px);
 $default-border:none;//2px solid var(--grid);
 $default-border-radius:var(--theme-border-radius);
-$default-content-background:var(--y);
+$default-content-background: var(--background1);
 $default-padding:var(--u);
 
 $mobile-content-margin:6em;
@@ -61,7 +61,6 @@ $mobile-content-margin:6em;
 
   //.#{$class-main-container} {
   main {
-    background: var(--dark-y);
     overflow: hidden;
     position: relative;
 
@@ -79,7 +78,7 @@ $mobile-content-margin:6em;
         .#{bem.$element-content} {
           background: $default-content-background;
 
-          border: $default-border;
+          border: var(--theme-border);
           border-radius: $default-border-radius;
           max-width: 600px;
           padding: $default-padding;
@@ -108,8 +107,9 @@ $mobile-content-margin:6em;
 
   .#{$class-horizontal-menu} {
     background: $default-content-background;
-    border-bottom: $default-border;
+    border-bottom: var(--theme-border);
     color: var(--heading);
+    z-index: 1;
 
     .#{bem.$element-content} {
       display: grid;
@@ -124,6 +124,11 @@ $mobile-content-margin:6em;
 
       .left {
         text-align: left;
+
+        .prev-button {
+          font-family: var(--theme-default-paragraph);
+          font-size: calc(var(--s2) * 1em);
+        }
       }
 
       .right {
@@ -210,6 +215,7 @@ $mobile-content-margin:6em;
 
               .next {
                 flex-grow: 1;
+                justify-content: flex-end;
               }
             }
           }

package/dist/cjs/c/ContentSlides/useContentSlides.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/c/{TeamGallery/TeamGallery.js → Modal/Modal.js}

@@ -4,34 +4,31 @@ 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 _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _common = require("./common");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 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; }
-
 // Local Definitions
-// import('./styles.scss')
-var baseClassName = _bem.default.base;
-var componentClassName = 'team-gallery';
 
-var TeamGallery = _ref => {
+var baseClassName = _exports.default.base;
+var componentClassName = 'modal';
+
+/**
+ * This is the component description.
+ */
+var Modal = _ref => {
   var {
     id,
     className: userClassName,
     style,
     children,
-    title // ...otherProps
-
+    title,
+    color,
+    close
+    // ...otherProps
   } = _ref;
   (0, React.useLayoutEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
@@ -40,41 +37,47 @@ var TeamGallery = _ref => {
     id: id,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
     style: style
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "title"
-  }, title), /*#__PURE__*/React.createElement("div", {
-    className: "content"
+    // {...otherProps}
+  }, /*#__PURE__*/React.createElement(_common.ModalHeader, {
+    title: title,
+    close: close,
+    color: color
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "modal-body"
   }, children));
 };
-
-TeamGallery.propTypes = {
+Modal.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.isRequired,
-
+  children: _propTypes.default.node,
+  /**
+   *  The title to pass to the header
+   */
+  title: _propTypes.default.string.isRequired,
+  /**
+   *  The color for the header button
+   */
+  color: _propTypes.default.string,
   /**
-   *  Title of gallery
+   *  The function to run upon closing the modal, if any
    */
-  title: _propTypes.default.string.isRequired
+  close: _propTypes.default.func
 };
-TeamGallery.defaultProps = {// someProp:false
+Modal.defaultProps = {
+  //
 };
-TeamGallery.PersonCard = _common.PersonCard;
-var _default = TeamGallery;
+var _default = Modal;
 exports.default = _default;

package/dist/cjs/{a/ContentCard/common/Section/Section.js → c/Modal/common/ModalHeader/ModalHeader.js}

@@ -4,77 +4,74 @@ 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 _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
+var _ = require("../../../..");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 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; }
-
 /* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
-var baseClassName = _bem.default.base;
-var componentClassName = 'section';
+
+var baseClassName = _exports.default.base;
+var componentClassName = 'modal-header';
+
 /**
  * This is the component description.
  */
-
-var Section = _ref => {
+var ModalHeader = _ref => {
   var {
     id,
     className: userClassName,
     style,
-    children,
-    layout,
-    contentAfter // ...otherProps
-
+    title,
+    close,
+    color
+    // ...otherProps
   } = _ref;
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, componentClassName, userClassName, layout === 'left' && 'layout-left', layout === 'right' && 'layout-right', layout === 'center' && 'layout-center', contentAfter && 'content-after'].filter(e => e).join(' '),
+    className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
     style: style
-  }, children);
+  }, /*#__PURE__*/React.createElement("p", null, title), /*#__PURE__*/React.createElement(_.Button, {
+    color: color,
+    onClick: () => close(),
+    isCompact: true,
+    className: "close-button"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "f-icons"
+  }, "Y")));
 };
-
-Section.propTypes = {
+ModalHeader.propTypes = {
   /**
-   * The HTML id for this element
-   */
+     * The HTML id for this element
+     */
   id: _propTypes.default.string,
-
   /**
-   * The HTML class names for this element
-   */
+     * The HTML class names for this element
+     */
   className: _propTypes.default.string,
-
   /**
-   * The React-written, css properties for this element.
-   */
+     * The React-written, css properties for this element.
+     */
   style: _propTypes.default.objectOf(_propTypes.default.string),
-
   /**
-   *  The children JSX
-   */
-  children: _propTypes.default.node,
-
+     *  The children JSX
+     */
+  title: _propTypes.default.string,
   /**
-   * The main content position
+   *  The close modal function
    */
-  layout: _propTypes.default.oneOf(['left', 'right', 'center']),
-
+  close: _propTypes.default.func,
   /**
-   * Whether content should appear before or after illustration
+   *  The color for the button to open and close the modal
    */
-  contentAfter: _propTypes.default.bool
+  color: _propTypes.default.string.isRequired
 };
-Section.defaultProps = {
-  contentAfter: false
+ModalHeader.defaultProps = {
+  // someProp:false
 };
-var _default = Section;
+var _default = ModalHeader;
 exports.default = _default;

package/dist/cjs/c/{SitePricing → Modal/common/ModalHeader}/index.js

@@ -3,13 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "SitePricing", {
+Object.defineProperty(exports, "ModalHeader", {
   enumerable: true,
   get: function get() {
-    return _SitePricing.default;
+    return _ModalHeader.default;
   }
 });
-
-var _SitePricing = _interopRequireDefault(require("./SitePricing"));
-
+var _ModalHeader = _interopRequireDefault(require("./ModalHeader"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/c/{BlogPostsList → Modal}/common/index.js

@@ -3,11 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Card", {
+Object.defineProperty(exports, "ModalHeader", {
   enumerable: true,
   get: function get() {
-    return _Card.Card;
+    return _ModalHeader.ModalHeader;
   }
 });
-
-var _Card = require("./Card");
+var _ModalHeader = require("./ModalHeader");

package/dist/cjs/{b/Card/common/Group → c/Modal}/index.js

@@ -3,13 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Group", {
+Object.defineProperty(exports, "Modal", {
   enumerable: true,
   get: function get() {
-    return _Group.default;
+    return _Modal.default;
   }
 });
-
-var _Group = _interopRequireDefault(require("./Group"));
-
+var _Modal = _interopRequireDefault(require("./Modal"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }