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

package/dist/es/c/ContentSlides/ContentSlides.js

@@ -1,162 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react';
-import { useInsertionEffect, useReducer } from 'react';
-import PropTypes from 'prop-types';
-import { useHistory } from 'react-router-dom';
-import styleNames from '@pareto-engineering/bem/exports';
-import ContentSlidesContext from "./Context";
-import { Slide, HorizontalMenu, Sidebar, Navigator } from "./common";
-
-// Local Definitions
-
-const baseClassName = styleNames.base;
-const componentClassName = 'content-slides';
-const reducer = (state, action) => {
-  switch (action.type) {
-    case 'SET_STEP_INDEX':
-      return {
-        ...state,
-        currentStepIndex: action.payload
-      };
-    case 'SET_CURRENT_STEP':
-      return {
-        ...state,
-        ...action.payload
-      };
-    case 'SET_EXTRA_CONTEXT':
-      return {
-        ...state,
-        ...action.payload
-      };
-    default:
-      return state;
-  }
-};
-
-/**
- * This is the component description.
- * Colors :
- * `y` : the background of the content
- */
-const ContentSlides = ({
-  id,
-  className: userClassName,
-  style,
-  children,
-  steps,
-  simple,
-  isDebug
-  // ...otherProps
-}) => {
-  useInsertionEffect(() => {
-    import("./styles.scss");
-  }, []);
-  const history = useHistory();
-  const [state, dispatch] = useReducer(reducer, {
-    currentStepIndex: 0
-  });
-  const {
-    // currentSlide,
-    currentStepIndex,
-    isFirstStep,
-    isLastStep
-  } = state;
-  const setNextStepIndex = (step = 1) => {
-    if (!isLastStep) {
-      dispatch({
-        type: 'SET_STEP_INDEX',
-        payload: currentStepIndex + step
-      });
-    }
-  };
-  const setPrevStepIndex = (step = 1) => {
-    if (!isFirstStep) {
-      dispatch({
-        type: 'SET_STEP_INDEX',
-        payload: currentStepIndex - step
-      });
-    }
-  };
-  const setStepIndex = index => {
-    dispatch({
-      type: 'SET_STEP_INDEX',
-      payload: index
-    });
-  };
-  const setCurrentStep = index => {
-    const newStep = steps[index];
-    if (newStep.location) {
-      history.push(newStep.location);
-    }
-    dispatch({
-      type: 'SET_CURRENT_STEP',
-      payload: {
-        currentStep: steps[index],
-        isFirstStep: index === 0,
-        isLastStep: index === steps.length - 1
-      }
-    });
-  };
-  useInsertionEffect(() => {
-    setCurrentStep(currentStepIndex);
-  }, [currentStepIndex]);
-  return /*#__PURE__*/React.createElement(ContentSlidesContext.Provider, {
-    value: {
-      steps,
-      setNextStepIndex,
-      setPrevStepIndex,
-      setStepIndex,
-      dispatch,
-      isDebug,
-      ...state
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [baseClassName, componentClassName, userClassName, simple && 'simple', 'u1 md-u2'].filter(e => e).join(' '),
-    style: style
-  }, children));
-};
-ContentSlides.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 slides properties
-  */
-  steps: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string.isRequired,
-    title: PropTypes.string.isRequired,
-    progress: PropTypes.number.isRequired,
-    location: PropTypes.string.isRequired
-  })),
-  /**
-   * Whether this shouldn't use a sidebar on desktop
-   */
-  simple: PropTypes.bool,
-  /**
-   * Whether the debug mode is enabled
-   */
-  isDebug: PropTypes.bool
-};
-ContentSlides.defaultProps = {
-  simple: false,
-  isDebug: false
-};
-ContentSlides.Sidebar = Sidebar;
-ContentSlides.HorizontalMenu = HorizontalMenu;
-ContentSlides.Slide = Slide;
-ContentSlides.Navigator = Navigator;
-export default ContentSlides;

package/dist/es/c/ContentSlides/Context.js

@@ -1,2 +0,0 @@
-import * as React from 'react';
-export default /*#__PURE__*/React.createContext({});

package/dist/es/c/ContentSlides/common/HorizontalMenu/HorizontalMenu.js

@@ -1,116 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem/exports';
-import { ProgressBar } from "../../../../a";
-import { Logo } from "../../../../b";
-import useContentSlides from "../../useContentSlides";
-
-// Local Definitions
-
-// const baseClassName = styleNames.base
-
-const componentClassName = 'horizontal-menu';
-
-/**
- * This is the component description.
- */
-const HorizontalMenu = ({
-  id,
-  className: userClassName,
-  style,
-  logoColor,
-  hideBackIcon,
-  stepsBackwards,
-  customPrevStep,
-  color
-  // ...otherProps
-}) => {
-  const {
-    setPrevStepIndex,
-    // setNextStepIndex,
-    currentStep,
-    isFirstStep
-    // currentStep,
-    // currentStepIndex,
-  } = useContentSlides();
-  const mobilePreviousStep = () => {
-    if (customPrevStep) {
-      customPrevStep();
-    } else {
-      setPrevStepIndex(stepsBackwards);
-    }
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [
-    // baseClassName,
-
-    componentClassName, userClassName].filter(e => e).join(' '),
-    style: style
-  }, currentStep?.progress > 0 && /*#__PURE__*/React.createElement(ProgressBar, {
-    progress: currentStep.progress,
-    attached: true,
-    height: ".4em",
-    color: color,
-    className: "y-background1 b-hard-y"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: styleNames.elementContent
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "left"
-  }, !isFirstStep && !hideBackIcon && /*#__PURE__*/React.createElement("span", {
-    className: "prev-button pointer",
-    onClick: mobilePreviousStep,
-    role: "button",
-    onKeyDown: mobilePreviousStep,
-    tabIndex: 0
-  }, '<--')), /*#__PURE__*/React.createElement("div", {
-    className: "title"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "md-h lg-h"
-  }, currentStep?.title), /*#__PURE__*/React.createElement(Logo, {
-    className: "xs-h sm-h y-transparent",
-    height: "1.1em",
-    color: logoColor
-  }))));
-};
-HorizontalMenu.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),
-  /**
-   * Number of backward steps for the customPrevStep
-   */
-  stepsBackwards: PropTypes.number,
-  /**
-   * A custom previous function
-   */
-  customPrevStep: PropTypes.func,
-  /**
-   * The logo color
-   */
-  logoColor: PropTypes.string,
-  /**
-   * Hide back icon boolean
-   */
-  hideBackIcon: PropTypes.bool,
-  /**
-   * String that will represent color for Progress bar
-   */
-  color: PropTypes.string
-};
-HorizontalMenu.defaultProps = {
-  logoColor: 'paragraph',
-  stepsBackwards: 1,
-  color: 'main2'
-};
-export default HorizontalMenu;

package/dist/es/c/ContentSlides/common/HorizontalMenu/index.js

@@ -1,2 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-export { default as HorizontalMenu } from "./HorizontalMenu";

package/dist/es/c/ContentSlides/common/Navigator/Navigator.js

@@ -1,118 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { Button } from "../../../../b";
-import useContentSlides from "../../useContentSlides";
-
-// Local Definitions
-
-const componentClassName = 'navigator';
-
-/**
- * This is the component description.
- */
-const Navigator = ({
-  id,
-  className: userClassName,
-  style,
-  canMoveForward,
-  previousColor,
-  nextColor,
-  stepsForward,
-  stepsBackwards,
-  customPrevStep,
-  customNextStep,
-  isLoading
-  // ...otherProps
-}) => {
-  const {
-    setPrevStepIndex,
-    setNextStepIndex,
-    isFirstStep,
-    isLastStep,
-    isDebug
-    // currentStep,
-    // currentStepIndex,
-  } = useContentSlides();
-  return /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [componentClassName, userClassName].filter(e => e).join(' '),
-    style: style
-  }, !isFirstStep ? /*#__PURE__*/React.createElement(Button, {
-    className: `x-${previousColor} prev`,
-    isSimple: true,
-    onClick: () => {
-      if (customPrevStep) {
-        customPrevStep();
-      } else {
-        setPrevStepIndex(stepsBackwards);
-      }
-    }
-  }, "Previous") : /*#__PURE__*/React.createElement("span", null), !isLastStep ? /*#__PURE__*/React.createElement(Button, {
-    className: `x-${nextColor} next`,
-    disabled: !isDebug && !canMoveForward,
-    isLoading: isLoading,
-    onClick: () => {
-      if (customNextStep) {
-        customNextStep();
-      } else {
-        setNextStepIndex(stepsForward);
-      }
-    },
-    isCompact: true
-  }, "Next") : /*#__PURE__*/React.createElement("span", null));
-};
-Navigator.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),
-  /**
-   * Whether the user can move to the next slide
-   */
-  canMoveForward: PropTypes.bool,
-  /**
-   * The previous color
-   */
-  previousColor: PropTypes.string,
-  /**
-   * The next color
-   */
-  nextColor: PropTypes.string,
-  /**
-   * Number of forward steps for the customNextStep
-   */
-  stepsForward: PropTypes.number,
-  /**
-   * Number of backward steps for the customPrevStep
-   */
-  stepsBackwards: PropTypes.number,
-  /**
-   * A custom previous function
-   */
-  customPrevStep: PropTypes.func,
-  /**
-   * A custom next function
-   */
-  customNextStep: PropTypes.func,
-  /**
-   * Button loading state
-   */
-  isLoading: PropTypes.bool
-};
-Navigator.defaultProps = {
-  canMoveForward: true,
-  previousColor: 'main2',
-  nextColor: 'main2',
-  stepsForward: 1,
-  stepsBackwards: 1
-};
-export default Navigator;

package/dist/es/c/ContentSlides/common/Navigator/index.js

@@ -1,2 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-export { default as Navigator } from "./Navigator";

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

@@ -1,84 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { IconList } from "../../../../a";
-import { ThemeSelector } from "../../../../b";
-import styleNames from '@pareto-engineering/bem/exports';
-import useContentSlides from "../../useContentSlides";
-
-// Local Definitions
-
-// const baseClassName = styleNames.base
-
-const componentClassName = 'sidebar';
-
-/**
- * This is the component description.
- */
-const Sidebar = ({
-  id,
-  className: userClassName,
-  style,
-  header,
-  footer
-  // ...otherProps
-}) => {
-  const {
-    steps,
-    // setPrevStepIndex,
-    // setNextStepIndex,
-    setStepIndex,
-    // isFirstStep,
-    // isLastStep,
-    // currentStep,
-    currentStepIndex
-  } = useContentSlides();
-  return /*#__PURE__*/React.createElement("nav", {
-    id: id,
-    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: styleNames.elementContent
-  }, /*#__PURE__*/React.createElement(IconList, null, steps.map((step, i) =>
-  /*#__PURE__*/
-  /* eslint-disable no-nested-ternary -- bc of math inequality cases */
-  React.createElement(IconList.Item, {
-    key: step.location,
-    icon: currentStepIndex === i ? 'L' : i < currentStepIndex ? 'I' : undefined,
-    iconHover: i < currentStepIndex ? 'L' : undefined,
-    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 ? /*#__PURE__*/React.createElement("footer", null, footer, /*#__PURE__*/React.createElement(ThemeSelector, {
-    className: "x-heading"
-  })) : /*#__PURE__*/React.createElement("span", null));
-};
-Sidebar.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 header JSX
-   */
-  header: PropTypes.node,
-  /**
-   *  The footer JSX
-   */
-  footer: PropTypes.node
-};
-Sidebar.defaultProps = {
-  // someProp:false
-};
-export default Sidebar;

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

@@ -1,65 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import styleNames from '@pareto-engineering/bem/exports';
-
-// Local Definitions
-import useContentSlides from "../../useContentSlides";
-
-// const baseClassName = styleNames.base
-
-const componentClassName = 'slide';
-
-/**
- * This is the component description.
- */
-const Slide = ({
-  id,
-  className: userClassName,
-  style,
-  children,
-  index
-  // ...otherProps
-}) => {
-  const {
-    currentStepIndex
-  } = useContentSlides();
-  const isActive = currentStepIndex === index;
-  return /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [
-    // baseClassName,
-    isActive && styleNames.modifierActive, componentClassName, userClassName].filter(e => e).join(' '),
-    style: style
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "wrapper"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "content"
-  }, children)));
-};
-Slide.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 index of this slide
-   */
-  index: PropTypes.number
-};
-Slide.defaultProps = {
-  // someProp:false
-};
-export default Slide;

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

@@ -1,4 +0,0 @@
-export { Sidebar } from "./Sidebar";
-export { HorizontalMenu } from "./HorizontalMenu";
-export { Slide } from "./Slide";
-export { Navigator } from "./Navigator";

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

@@ -1,4 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-export { default as ContentSlides } from "./ContentSlides";
-export { default as useContentSlides } from "./useContentSlides";
-export { default as ContentSlidesContext } from "./Context";