@pareto-engineering/design-system 4.0.0-alpha.9 → 4.0.0

package/dist/cjs/a/MetaCard/MetaCard.js

@@ -7,9 +7,12 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
+require("./styles.scss");
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
 
 const baseClassName = _exports.default.base;
@@ -24,14 +27,12 @@ const MetaCard = _ref => {
     className: userClassName,
     style,
     children,
-    hasBackgroundBlur
+    hasBackgroundBlur,
+    spaced
   } = _ref;
-  (0, React.useInsertionEffect)(() => {
-    Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
-  }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, componentClassName, userClassName, hasBackgroundBlur && _exports.default.modifierBlur].filter(e => e).join(' '),
+    className: [baseClassName, componentClassName, userClassName, hasBackgroundBlur && _exports.default.modifierBlur, spaced && _exports.default.modifierSpaced].filter(e => e).join(' '),
     style: style
   }, children);
 };
@@ -51,10 +52,13 @@ MetaCard.propTypes = {
   /**
    * Whether the card has a background blur
    * */
-  hasBackgroundBlur: _propTypes.default.bool
+  hasBackgroundBlur: _propTypes.default.bool,
+  /**
+   * Whether to apply a gap to the top and bottom
+   * */
+  spaced: _propTypes.default.bool
 };
 MetaCard.defaultProps = {
   // someProp:false
 };
-var _default = MetaCard;
-exports.default = _default;
+var _default = exports.default = MetaCard;

package/dist/cjs/a/MetaCard/styles.scss

@@ -1,9 +1,11 @@
 /* @pareto-engineering/generator-front 1.0.12 */
+/* stylelint-disable selector-max-universal -- exception */
 
 @use "@pareto-engineering/bem";
 @use "@pareto-engineering/styles/src/mixins";
 @use "@pareto-engineering/styles/src/globals" as *;
 
+$default-padding: var(--spacing-2) 0;
 $default-border-radius: 2.25rem;
 $default-border-color: var(--hard-background-cards);
 $default-background: var(--background-cards-50);
@@ -14,6 +16,7 @@ $default-blur: var(--theme-default-blur);
   background: $default-background;
   border: 1px solid $default-border-color;
   border-radius: $default-border-radius;
+  padding: $default-padding;
 
   &.#{bem.$modifier-blur} {
     backdrop-filter: $default-blur;
@@ -23,6 +26,20 @@ $default-blur: var(--theme-default-blur);
     // Temporary solution
     margin-left: calc((var(--gap)) * -1);
     margin-right: calc((var(--gap)) * -1);
-    padding: var(--gap);
+    padding: 0 var(--gap);
+
+    &.#{bem.$modifier-spaced} {
+      padding: var(--gap);
+
+      > * {
+        &:first-child {
+          margin-top: 0;
+        }
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+      }
+    }
   }
 }

package/dist/cjs/a/People/People.js

@@ -8,9 +8,14 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _common = require("./common");
+require("./styles.scss");
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.0.12 */
+
+// Local Definitions
+
 const baseClassName = _exports.default.base;
 const componentClassName = 'people';
 
@@ -27,9 +32,6 @@ const People = _ref => {
     columnWidth
     // ...otherProps
   } = _ref;
-  (0, React.useInsertionEffect)(() => {
-    Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
-  }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName, 'u1'].filter(e => e).join(' '),
@@ -72,5 +74,4 @@ People.defaultProps = {
   columnWidth: '12em'
 };
 People.Person = _common.Person;
-var _default = People;
-exports.default = _default;
+var _default = exports.default = People;

package/dist/cjs/a/People/common/Person/Person.js

@@ -8,8 +8,8 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /* @pareto-engineering/generator-front 1.0.12 */
 
 // Local Definitions
@@ -31,19 +31,24 @@ const Person = _ref => {
     color
     // ...otherProps
   } = _ref;
+  const handleImageSrcError = e => {
+    e.target.onerror = null;
+    e.target.src = '/default-avatar.svg';
+  };
   return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName, `y-${color}`].filter(e => e).join(' '),
     style: style
   }, /*#__PURE__*/React.createElement("img", {
     className: "image v50 mr-v",
-    src: image,
-    alt: `${name}, ${role}`
+    src: image || '/default-avatar.svg',
+    alt: `${name}, ${role}`,
+    onError: handleImageSrcError
   }), /*#__PURE__*/React.createElement("div", {
     className: "details"
-  }, /*#__PURE__*/React.createElement("p", {
+  }, name && /*#__PURE__*/React.createElement("p", {
     className: "name"
-  }, name), /*#__PURE__*/React.createElement("p", {
+  }, name), role && /*#__PURE__*/React.createElement("p", {
     className: "role"
   }, role)));
 };
@@ -67,18 +72,17 @@ Person.propTypes = {
   /**
    *  The person's name
    */
-  name: _propTypes.default.string.isRequired,
+  name: _propTypes.default.string,
   /**
    *  The person's role
    */
-  role: _propTypes.default.string.isRequired,
+  role: _propTypes.default.string,
   /**
    * The base color of the person's component
    */
   color: _propTypes.default.string
 };
 Person.defaultProps = {
-  color: 'background2'
+  color: 'background-far'
 };
-var _default = Person;
-exports.default = _default;
+var _default = exports.default = Person;

package/dist/cjs/a/People/styles.scss

@@ -11,7 +11,9 @@ $default-padding:var(--u);
 $default-horizontal-margin: .5em;
 
 $default-grid-gap: 1em;
-$default-image-padding: 1.5rem;
+$default-margin: 1em;
+$default-image-margin: var(--default-image-margin, #{$default-margin});
+$default-color: var(--default-color, var(--paragraph));
 
 .#{bem.$base}.people {
   display: grid;
@@ -29,18 +31,22 @@ $default-image-padding: 1.5rem;
     .image {
       border-radius: $default-border-radius;
       height: var(--image-size);
-      margin-right: $default-image-padding;
+      margin-right: $default-image-margin;
       width: var(--image-size);
     }
 
     .details {
       align-items: flex-start;
-      color: var(--grey);
+      color: $default-color;
       display: flex;
       flex-direction: column;
 
+      p:only-child {
+        margin: 0;
+      }
+
       .name {
-        color: var(--grey);
+        color: $default-color;
         margin-bottom: .1em;
       }
 

package/dist/cjs/a/Popover/Popover.js

@@ -4,13 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _utils = require("../../utils");
+require("./styles.scss");
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.0.12 */
+
+// Local Definitions
+
 const baseClassName = _exports.default.base;
 const componentClassName = 'popover';
 
@@ -32,10 +38,7 @@ const Popover = _ref => {
     offsetYPx
     // ...otherProps
   } = _ref;
-  (0, React.useInsertionEffect)(() => {
-    Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
-  }, []);
-  const popoverRef = (0, React.useRef)(null);
+  const popoverRef = (0, _react.useRef)(null);
   const {
     primaryPosition,
     secondaryPosition
@@ -104,12 +107,11 @@ Popover.propTypes = {
   })])
 };
 Popover.defaultProps = {
-  color: 'background1',
+  color: 'background-near',
   isOpen: false,
   preferredPrimaryOrder: ['bottom', 'top', 'right', 'left'],
   preferredSecondaryOrder: ['left', 'right', 'bottom', 'top'],
   offsetXPx: 16,
   offsetYPx: 0
 };
-var _default = Popover;
-exports.default = _default;
+var _default = exports.default = Popover;

package/dist/cjs/a/Popover/styles.scss

@@ -2,7 +2,7 @@
 
 @use "@pareto-engineering/bem";
 
-$default-border: var(--theme-border-style) var(--metadata);
+$default-border: var(--theme-default-border-style) var(--metadata);
 
 .#{bem.$base}.popover {
   background-color: var(--x);

package/dist/cjs/a/ProgressBar/ProgressBar.js

@@ -7,9 +7,12 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
+require("./styles.scss");
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
 
 const baseClassName = _exports.default.base;
@@ -26,15 +29,13 @@ const ProgressBar = _ref => {
     attached,
     color,
     progress,
-    height
+    height,
+    rounded
     // ...otherProps
   } = _ref;
-  (0, React.useInsertionEffect)(() => {
-    Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
-  }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, componentClassName, attached && _exports.default.modifierAttached, color && `x-${color}`, userClassName].filter(e => e).join(' '),
+    className: [baseClassName, componentClassName, attached && _exports.default.modifierAttached, color && `x-${color}`, userClassName, rounded && 'rounded'].filter(e => e).join(' '),
     style: {
       '--progress': progress,
       '--height': height,
@@ -44,7 +45,6 @@ const ProgressBar = _ref => {
     // {...otherProps}
   });
 };
-
 ProgressBar.propTypes = {
   /**
    * The HTML id for this element
@@ -78,5 +78,4 @@ ProgressBar.propTypes = {
 ProgressBar.defaultProps = {
   attached: false
 };
-var _default = ProgressBar;
-exports.default = _default;
+var _default = exports.default = ProgressBar;

package/dist/cjs/a/ProgressBar/styles.scss

@@ -5,9 +5,11 @@
 $default-height:var(--height, 1em);
 $default-border:none;//2px solid var(--grid);
 $default-transition-duration:.5s;
-$default-color:var(--x, var(--main1));
+$default-color:var(--x, var(--main));
+$default-border-radius:var(--theme-border-radius, 1.875rem);
 
 .#{bem.$base}.progress-bar {
+  background-color: var(--progress-bar-background-color);
   border: $default-border;
   height: $default-height;
   position: relative;
@@ -28,6 +30,14 @@ $default-color:var(--x, var(--main1));
     z-index: 1;
   }
 
+  &.rounded {
+    border-radius: $default-border-radius;
+
+    &::after {
+      border-radius: $default-border-radius;
+    }
+  }
+
   &.#{bem.$modifier-attached} {
     border: unset;
     border-bottom: $default-border;

package/dist/cjs/a/Quote/Quote.js

@@ -7,9 +7,12 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
+require("./styles.scss");
 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 (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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.0.12 */
+
 // Local Definitions
 
 const baseClassName = _exports.default.base;
@@ -29,9 +32,6 @@ const Quote = _ref => {
     color
     // ...otherProps
   } = _ref;
-  (0, React.useInsertionEffect)(() => {
-    Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
-  }, []);
   return /*#__PURE__*/React.createElement("figure", {
     id: id,
     className: [baseClassName, componentClassName, userClassName, `x-${color}`].filter(e => e).join(' '),
@@ -39,12 +39,22 @@ const Quote = _ref => {
     // {...otherProps}
   }, /*#__PURE__*/React.createElement("blockquote", {
     cite: source,
-    className: "blockquote uc"
+    className: "blockquote"
   }, /*#__PURE__*/React.createElement("p", {
-    className: "quotation c-x md-s0 s-1"
-  }, children)), /*#__PURE__*/React.createElement("figcaption", {
+    className: "quotation h2"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "c-x"
+  }, "\u201C"), /*#__PURE__*/React.createElement("span", {
+    className: "c-x"
+  }, children), /*#__PURE__*/React.createElement("span", {
+    className: "c-x"
+  }, "\u201D"))), /*#__PURE__*/React.createElement("figcaption", {
     className: "figcaption"
-  }, /*#__PURE__*/React.createElement("cite", null, author)));
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "x-metadata c-x"
+  }, "-"), /*#__PURE__*/React.createElement("cite", {
+    className: "x-metadata c-x"
+  }, author)));
 };
 Quote.propTypes = {
   /**
@@ -77,7 +87,6 @@ Quote.propTypes = {
   color: _propTypes.default.string
 };
 Quote.defaultProps = {
-  color: 'main1'
+  color: 'highlighted'
 };
-var _default = Quote;
-exports.default = _default;
+var _default = exports.default = Quote;

package/dist/cjs/a/Quote/styles.scss

@@ -4,53 +4,32 @@
 @use "@pareto-engineering/styles/src/mixins";
 @use "@pareto-engineering/styles/src/globals" as *;
 
+$default-gap: 3rem;
 
 .#{bem.$base}.quote {
-  align-items: center;
+  border-left: 3px solid var(--x);
   display: flex;
   flex-direction: column;
 
-  .blockquote {
+  > .blockquote {
     margin: 0;
-    padding: 0;
-  }
-
-  .figcaption {
-    padding: 0;
-  }
 
-  @include mixins.media($from:$sm-md) {
-    .blockquote {
-      .quotation {
-        display: inline;
-      }
-
-      &::before {
-        color: transparent;
-        content: "\201C";
-        font-size: 4em;
-        line-height: 0;
-        opacity: inherit;
-        position: static;
-        -webkit-text-stroke: 1px var(--x);
-        vertical-align: -.4em;
-      }
-
-      &::after {
-        color: transparent;
-        content: "\201D";
-        font-size: 4em;
-        line-height: 0;
-        margin-left: -.1em;
-        -webkit-text-stroke: 1px var(--x);
-        vertical-align: -.6em;
-      }
+    > .h2 {
+      margin-left: 0;
+      margin-top: 0;
     }
 
-    .figcaption {
-      margin: 0;
+    > .quotation {
+      margin-left: $default-gap;
     }
   }
-}
 
+  > .figcaption {
+    margin-left: $default-gap;
+    padding: 0;
 
+    > cite {
+      font-style: normal;
+    }
+  }
+}

package/dist/cjs/a/Removable/Removable.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
+require("./styles.scss");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/* @pareto-engineering/generator-front 1.1.1-alpha.1 */
+
+// Local Definitions
+
+const baseClassName = _exports.default.base;
+const componentClassName = 'removable';
+
+/**
+ * This is a wrapper component that adds a close button to its children.
+ */
+const Removable = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    handleClose,
+    children
+    // ...otherProps
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    id: id,
+    className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
+    style: style
+    // {...otherProps}
+  }, children, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "close-button",
+    onClick: handleClose || (() => null)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "icon"
+  }, "Y")));
+};
+Removable.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 function to call when the close button is clicked
+   */
+  handleClose: _propTypes.default.func,
+  /**
+   *  The children JSX
+   */
+  children: _propTypes.default.node
+};
+Removable.defaultProps = {
+  // someProp:false
+};
+var _default = exports.default = Removable;

package/dist/cjs/{c/ContentSlides/common/Navigator → a/Removable}/index.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Navigator", {
+Object.defineProperty(exports, "Removable", {
   enumerable: true,
   get: function () {
-    return _Navigator.default;
+    return _Removable.default;
   }
 });
-var _Navigator = _interopRequireDefault(require("./Navigator"));
+var _Removable = _interopRequireDefault(require("./Removable"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/cjs/a/Removable/styles.scss

@@ -0,0 +1,33 @@
+/* @pareto-engineering/generator-front 1.1.1-alpha.1 */
+
+@use "@pareto-engineering/bem";
+
+$default-padding: .5rem;
+
+.#{bem.$base}.removable {
+  align-items: center;
+  background-color: var(--background-inputs);
+  border: var(--theme-default-border-style) var(--main2);
+  border-radius: $default-padding;
+  display: flex;
+  justify-content: space-between;
+  padding: $default-padding;
+
+  > :first-child {
+    flex-grow: 1;
+  }
+
+  .close-button {
+    background-color: transparent;
+    border: none;
+    color: var(--metadata);
+    cursor: pointer;
+    margin-left: var(--gap);
+
+    &:hover {
+      color: var(--hard-metadata);
+    }
+  }
+}
+
+