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

package/dist/es/a/DashboardNavbar/common/NavItem/NavItem.js

@@ -1,48 +1,51 @@
 /* @pareto-engineering/generator-front 0.2.4 */
 import * as React from 'react';
-import PropTypes from 'prop-types'; // Package-level Imports
+import PropTypes from 'prop-types';
+
+// Package-level Imports
 // import styleNames from 'style_names.scss'
+
 // Component-level imports
+import("./styles.scss");
 
-import("./styles.scss"); // Helper Definition
+// Helper Definition
 // const baseClassName = styleNames.base
-
 const componentClassName = 'nav-item';
-
-const NavItem = ({
-  id,
-  className: userClassName,
-  style,
-  children // ...otherProps
-
-}) => /*#__PURE__*/React.createElement("div", {
-  id: id,
-  className: [// baseClassName,
-  componentClassName, userClassName].filter(e => e).join(' '),
-  style: style
-}, "Nav Item", children);
-
+const NavItem = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    children
+    // ...otherProps
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    id: id,
+    className: [
+    // baseClassName,
+    componentClassName, userClassName].filter(e => e).join(' '),
+    style: style
+  }, "Nav Item", children);
+};
 NavItem.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The children JSX
    */
   children: PropTypes.node
 };
-NavItem.defaultProps = {// someProp:false
+NavItem.defaultProps = {
+  // someProp:false
 };
 export default NavItem;

package/dist/es/a/DashboardNavbar/common/NavProfile/NavProfile.js

@@ -1,48 +1,51 @@
 /* @pareto-engineering/generator-front 0.2.4 */
 import * as React from 'react';
-import PropTypes from 'prop-types'; // Package-level Imports
+import PropTypes from 'prop-types';
+
+// Package-level Imports
 // import styleNames from 'style_names.scss'
+
 // Component-level imports
+import("./styles.scss");
 
-import("./styles.scss"); // Helper Definition
+// Helper Definition
 // const baseClassName = styleNames.base
-
 const componentClassName = 'nav-profile';
-
-const NavProfile = ({
-  id,
-  className: userClassName,
-  style,
-  children // ...otherProps
-
-}) => /*#__PURE__*/React.createElement("div", {
-  id: id,
-  className: [// baseClassName,
-  componentClassName, userClassName].filter(e => e).join(' '),
-  style: style
-}, "Nav Profile", children);
-
+const NavProfile = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    children
+    // ...otherProps
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    id: id,
+    className: [
+    // baseClassName,
+    componentClassName, userClassName].filter(e => e).join(' '),
+    style: style
+  }, "Nav Profile", children);
+};
 NavProfile.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The children JSX
    */
   children: PropTypes.node
 };
-NavProfile.defaultProps = {// someProp:false
+NavProfile.defaultProps = {
+  // someProp:false
 };
 export default NavProfile;

package/dist/es/a/DotInfo/DotInfo.js

@@ -2,25 +2,28 @@
 import * as React from 'react';
 import { useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem'; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+
+// Local Definitions
 
 const baseClassName = styleNames.base;
 const componentClassName = 'dot-info';
+
 /**
  * This is the component description.
  */
-
-const DotInfo = ({
-  id,
-  className: userClassName,
-  style,
-  booleanValue,
-  height,
-  colorTrue,
-  colorFalse,
-  colorEmpty // ...otherProps
-
-}) => {
+const DotInfo = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    booleanValue,
+    height,
+    colorTrue,
+    colorFalse,
+    colorEmpty
+    // ...otherProps
+  } = _ref;
   useLayoutEffect(() => {
     import("./styles.scss");
   }, []);
@@ -33,43 +36,35 @@ const DotInfo = ({
     }
   });
 };
-
 DotInfo.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  Boolean value to be converted into string
    */
   booleanValue: PropTypes.bool,
-
   /**
    * Color for true case
    */
   colorTrue: PropTypes.string,
-
   /**
    * Color for false case
    */
   colorFalse: PropTypes.string,
-
   /**
    * Color for the border when empty value
    */
   colorEmpty: PropTypes.string,
-
   /**
    * The height of the dot
    */
@@ -79,7 +74,8 @@ DotInfo.defaultProps = {
   colorTrue: 'success',
   colorFalse: 'error',
   colorEmpty: 'metadata',
-  height: '2em' // someProp:false
-
+  height: '2em'
+  // someProp:false
 };
+
 export default DotInfo;

package/dist/es/a/FeaturedOn/FeaturedOn.js

@@ -2,29 +2,32 @@
 import * as React from 'react';
 import { useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem'; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+
+// Local Definitions
 
 const baseClassName = styleNames.base;
 const componentClassName = 'featured-on';
+
 /**
  * This is the component description.
  */
-
-const FeaturedOn = ({
-  id,
-  className: userClassName,
-  style,
-  featuresMap // ...otherProps
-
-}) => {
+const FeaturedOn = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    featuresMap
+    // ...otherProps
+  } = _ref;
   useLayoutEffect(() => {
     import("./styles.scss");
   }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName, 'u1'].filter(e => e).join(' '),
-    style: style // {...otherProps}
-
+    style: style
+    // {...otherProps}
   }, /*#__PURE__*/React.createElement("p", {
     className: "x-metadata c-x uc u1 mb-u md-s0 s-1"
   }, "As featured on"), /*#__PURE__*/React.createElement("div", {
@@ -41,23 +44,19 @@ const FeaturedOn = ({
     alt: feature.altText
   })))));
 };
-
 FeaturedOn.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The featuresMap
    */
@@ -67,6 +66,7 @@ FeaturedOn.propTypes = {
     link: PropTypes.string.isRequired
   })).isRequired
 };
-FeaturedOn.defaultProps = {// someProp:false
+FeaturedOn.defaultProps = {
+  // someProp:false
 };
 export default FeaturedOn;

package/dist/es/a/FeaturedOn/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 *;
 
 .#{bem.$base}.featured-on {
   .title {

package/dist/es/a/Figure/Figure.js

@@ -2,67 +2,65 @@
 import * as React from 'react';
 import { useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem'; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+
+// Local Definitions
 
 const baseClassName = styleNames.base;
 const componentClassName = 'photo-card';
+
 /**
  * This is the component description.
  */
-
-const Figure = ({
-  id,
-  className: userClassName,
-  style,
-  src,
-  alt,
-  caption
-}) => {
+const Figure = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    src,
+    alt,
+    caption
+  } = _ref;
   useLayoutEffect(() => {
     import("./styles.scss");
   }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
-    style: style // {...otherProps}
-
+    style: style
+    // {...otherProps}
   }, /*#__PURE__*/React.createElement("figure", null, /*#__PURE__*/React.createElement("img", {
     src: src,
     alt: alt
   }), /*#__PURE__*/React.createElement("figcaption", null, caption || alt)));
 };
-
 Figure.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    * The source to the photo to be displayed
    */
   src: PropTypes.string,
-
   /**
    * The alternate text for the photo
    */
   alt: PropTypes.string,
-
   /**
    * The caption that will appear beneath the photo
    */
   caption: PropTypes.string
 };
-Figure.defaultProps = {// someProp:false
+Figure.defaultProps = {
+  // someProp:false
 };
 export default Figure;

package/dist/es/a/HamburgerButton/HamburgerButton.js

@@ -1,10 +1,11 @@
-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 _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); }
 /* @pareto-engineering/generator-front 1.0.12 */
 import * as React from 'react';
 import { useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem'; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+
+// Local Definitions
 
 const baseClassName = styleNames.base;
 const componentClassName = 'hamburger-button';
@@ -13,17 +14,17 @@ const hamburgerType = 'squeeze'; // docs : https://jonsuh.com/hamburgers/#sass
 /**
  * This is the component description.
  */
-
-const HamburgerButton = ({
-  id,
-  className: userClassName,
-  style,
-  children,
-  isOpen,
-  ariaLabel,
-  color,
-  ...otherProps
-}) => {
+const HamburgerButton = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    children,
+    isOpen,
+    ariaLabel,
+    color,
+    ...otherProps
+  } = _ref;
   useLayoutEffect(() => {
     import("./styles.scss");
   }, []);
@@ -40,38 +41,31 @@ const HamburgerButton = ({
     className: "hamburger-inner"
   })));
 };
-
 HamburgerButton.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The children JSX
    */
   children: PropTypes.node,
-
   /**
    * Whether the menu is open
    */
   isOpen: PropTypes.bool.isRequired,
-
   /**
    * The button color
    */
   color: PropTypes.string,
-
   /**
    * The accessibility label
    */

package/dist/es/a/IconList/IconList.js

@@ -1,72 +1,70 @@
-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 _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); }
 /* @pareto-engineering/generator-front 1.0.12 */
 import * as React from 'react';
 import { useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem';
-import { Item } from "./common"; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+import { Item } from "./common";
+
+// Local Definitions
 
 const baseClassName = styleNames.base;
 const componentClassName = 'icon-list';
+
 /**
  * This is the component description.
  */
-
-const IconList = ({
-  id,
-  className: userClassName,
-  style,
-  children,
-  icon,
-  iconHover,
-  ...otherProps
-}) => {
+const IconList = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    children,
+    icon,
+    iconHover,
+    ...otherProps
+  } = _ref;
   useLayoutEffect(() => {
     import("./styles.scss");
   }, []);
   return /*#__PURE__*/React.createElement("ul", _extends({
     id: id,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
-    style: { ...style,
+    style: {
+      ...style,
       '--list-icon': icon && `"${icon}"`,
       '--list-icon-hover': iconHover && `"${iconHover}"`
     }
   }, otherProps), children);
 };
-
 IconList.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The children JSX
    */
   children: PropTypes.node,
-
   /**
    * The icon of the list element
    */
   icon: PropTypes.string,
-
   /**
    * The icon of the list element on hover
    */
   iconHover: PropTypes.string
 };
-IconList.defaultProps = {// someProp:false
+IconList.defaultProps = {
+  // someProp:false
 };
 IconList.Item = Item;
 export default IconList;

package/dist/es/a/IconList/common/Item/Item.js

@@ -1,63 +1,63 @@
-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 _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); }
 /* @pareto-engineering/generator-front 1.0.12 */
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem'; // Local Definitions
+import styleNames from '@pareto-engineering/bem/exports';
+
+// Local Definitions
 
 const componentClassName = styleNames.elementItem;
+
 /**
  * This is the component description.
  */
-
-const Item = ({
-  id,
-  className: userClassName,
-  style,
-  children,
-  icon,
-  iconHover,
-  ...otherProps
-}) => /*#__PURE__*/React.createElement("li", _extends({
-  id: id,
-  className: [componentClassName, userClassName].filter(e => e).join(' '),
-  style: { ...style,
-    '--list-icon': icon && `"${icon}"`,
-    '--list-icon-hover': iconHover && `"${iconHover}"`
-  }
-}, otherProps), children);
-
+const Item = _ref => {
+  let {
+    id,
+    className: userClassName,
+    style,
+    children,
+    icon,
+    iconHover,
+    ...otherProps
+  } = _ref;
+  return /*#__PURE__*/React.createElement("li", _extends({
+    id: id,
+    className: [componentClassName, userClassName].filter(e => e).join(' '),
+    style: {
+      ...style,
+      '--list-icon': icon && `"${icon}"`,
+      '--list-icon-hover': iconHover && `"${iconHover}"`
+    }
+  }, otherProps), children);
+};
 Item.propTypes = {
   /**
    * The HTML id for this element
    */
   id: PropTypes.string,
-
   /**
    * The HTML class names for this element
    */
   className: PropTypes.string,
-
   /**
    * The React-written, css properties for this element.
    */
   style: PropTypes.objectOf(PropTypes.string),
-
   /**
    *  The children JSX
    */
   children: PropTypes.node,
-
   /**
    * The icon of the list element
    */
   icon: PropTypes.string,
-
   /**
    * The icon of the list element on hover
    */
   iconHover: PropTypes.string
 };
+
 /*
 Item.defaultProps = {
 }