@hipay/hipay-material-ui 1.0.0-beta.9 → 2.0.0-beta.36

package/es/Stepper/StepConnector.js

@@ -1,85 +0,0 @@
-import _extends from 'babel-runtime/helpers/extends';
-import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import withStyles from '../styles/withStyles';
-
-export const styles = theme => ({
-  root: {
-    flex: '1 1 auto'
-  },
-  horizontal: {},
-  vertical: {
-    marginLeft: 12, // half icon
-    padding: `0 0 ${theme.spacing.unit}px`
-  },
-  alternativeLabel: {
-    position: 'absolute',
-    top: theme.spacing.unit + 4,
-    left: 'calc(50% + 20px)',
-    right: 'calc(-50% + 20px)'
-  },
-  line: {
-    display: 'block',
-    borderColor: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]
-  },
-  lineHorizontal: {
-    borderTopStyle: 'solid',
-    borderTopWidth: 1
-  },
-  lineVertical: {
-    borderLeftStyle: 'solid',
-    borderLeftWidth: 1,
-    minHeight: theme.spacing.unit * 3
-  }
-});
-
-/**
- * @ignore - internal component.
- */
-function StepConnector(props) {
-  const { alternativeLabel, className: classNameProp, classes, orientation } = props,
-        other = _objectWithoutProperties(props, ['alternativeLabel', 'className', 'classes', 'orientation']);
-
-  const className = classNames(classes.root, classes[orientation], {
-    [classes.alternativeLabel]: alternativeLabel
-  }, classNameProp);
-  const lineClassName = classNames(classes.line, {
-    [classes.lineHorizontal]: orientation === 'horizontal',
-    [classes.lineVertical]: orientation === 'vertical'
-  });
-
-  return React.createElement(
-    'div',
-    _extends({ className: className }, other),
-    React.createElement('span', { className: lineClassName })
-  );
-}
-
-StepConnector.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * @ignore
-   * Set internally by Step when it's supplied with the alternativeLabel property.
-   */
-  alternativeLabel: PropTypes.bool,
-  /**
-   * Useful to extend the style applied to the component.
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * @ignore
-   */
-  orientation: PropTypes.oneOf(['horizontal', 'vertical'])
-} : {};
-
-StepConnector.defaultProps = {
-  alternativeLabel: false,
-  orientation: 'horizontal'
-};
-
-export default withStyles(styles, { name: 'MuiStepConnector' })(StepConnector);

package/es/Stepper/StepContent.js

@@ -1,116 +0,0 @@
-import _extends from 'babel-runtime/helpers/extends';
-import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
-import React from 'react';
-import PropTypes from 'prop-types';
-import warning from 'warning';
-import classNames from 'classnames';
-import Collapse from '../transitions/Collapse';
-import withStyles from '../styles/withStyles';
-
-export const styles = theme => ({
-  root: {
-    marginTop: theme.spacing.unit,
-    marginLeft: 12, // half icon
-    paddingLeft: theme.spacing.unit + 12, // margin + half icon
-    paddingRight: theme.spacing.unit,
-    borderLeft: `1px solid ${theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]}`
-  },
-  last: {
-    borderLeft: 'none'
-  },
-  transition: {}
-});
-
-function StepContent(props) {
-  const {
-    active,
-    alternativeLabel,
-    children,
-    classes,
-    className,
-    completed,
-    last,
-    optional,
-    orientation,
-    transition: Transition,
-    transitionDuration
-  } = props,
-        other = _objectWithoutProperties(props, ['active', 'alternativeLabel', 'children', 'classes', 'className', 'completed', 'last', 'optional', 'orientation', 'transition', 'transitionDuration']);
-
-  process.env.NODE_ENV !== "production" ? warning(orientation === 'vertical', 'Material-UI: <StepContent /> is only designed for use with the vertical stepper.') : void 0;
-
-  return React.createElement(
-    'div',
-    _extends({ className: classNames(classes.root, { [classes.last]: last }, className) }, other),
-    React.createElement(
-      Transition,
-      {
-        'in': active,
-        className: classes.transition,
-        timeout: transitionDuration,
-        unmountOnExit: true
-      },
-      children
-    )
-  );
-}
-
-StepContent.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * @ignore
-   * Expands the content.
-   */
-  active: PropTypes.bool,
-  /**
-   * @ignore
-   * Set internally by Step when it's supplied with the alternativeLabel property.
-   */
-  alternativeLabel: PropTypes.bool,
-  /**
-   * Step content.
-   */
-  children: PropTypes.node,
-  /**
-   * @ignore
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * @ignore
-   */
-  completed: PropTypes.bool,
-  /**
-   * @ignore
-   */
-  last: PropTypes.bool,
-  /**
-   * @ignore
-   * Set internally by Step when it's supplied with the optional property.
-   */
-  optional: PropTypes.bool,
-  /**
-   * @ignore
-   */
-  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
-  /**
-   * Collapse component.
-   */
-  transition: PropTypes.func,
-  /**
-   * Adjust the duration of the content expand transition.
-   * Passed as a property to the transition component.
-   *
-   * Set to 'auto' to automatically calculate transition time based on height.
-   */
-  transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({ enter: PropTypes.number, exit: PropTypes.number }), PropTypes.oneOf(['auto'])])
-} : {};
-
-StepContent.defaultProps = {
-  transition: Collapse,
-  transitionDuration: 'auto'
-};
-
-export default withStyles(styles, { name: 'MuiStepContent' })(StepContent);

package/es/Stepper/StepIcon.js

@@ -1,54 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import CheckCircle from '../internal/svg-icons/CheckCircle';
-import withStyles from '../styles/withStyles';
-import StepPositionIcon from './StepPositionIcon';
-
-export const styles = theme => ({
-  root: {
-    display: 'block'
-  },
-  completed: {
-    color: theme.palette.primary.main
-  }
-});
-
-function StepIcon(props) {
-  const { completed, icon, active, classes } = props;
-
-  if (typeof icon === 'number' || typeof icon === 'string') {
-    if (completed) {
-      return React.createElement(CheckCircle, { className: classNames(classes.root, classes.completed) });
-    }
-    return React.createElement(StepPositionIcon, { className: classes.root, position: icon, active: active });
-  }
-
-  return icon;
-}
-
-StepIcon.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * Whether this step is active.
-   */
-  active: PropTypes.bool,
-  /**
-   * Classses for component style customizations.
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * Mark the step as completed. Is passed to child components.
-   */
-  completed: PropTypes.bool,
-  /**
-   * The icon displayed by the step label.
-   */
-  icon: PropTypes.node.isRequired
-} : {};
-
-StepIcon.defaultProps = {
-  active: false,
-  completed: false
-};
-
-export default withStyles(styles, { name: 'MuiStepIcon' })(StepIcon);

package/es/Stepper/StepLabel.js

@@ -1,170 +0,0 @@
-import _extends from 'babel-runtime/helpers/extends';
-import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import withStyles from '../styles/withStyles';
-import Typography from '../Typography';
-import StepIcon from './StepIcon';
-
-export const styles = theme => ({
-  root: {
-    display: 'flex',
-    alignItems: 'center'
-  },
-  horizontal: {},
-  vertical: {},
-  alternativeLabel: {
-    flexDirection: 'column'
-  },
-  disabled: {
-    cursor: 'default'
-  },
-  label: {
-    color: theme.palette.text.secondary
-  },
-  labelActive: {
-    color: theme.palette.text.primary,
-    fontWeight: 500
-  },
-  labelCompleted: {
-    color: theme.palette.text.primary,
-    fontWeight: 500
-  },
-  labelAlternativeLabel: {
-    textAlign: 'center',
-    marginTop: theme.spacing.unit * 2
-  },
-  iconContainer: {
-    paddingRight: theme.spacing.unit
-  },
-  iconContainerAlternativeLabel: {
-    paddingRight: 0
-  },
-  labelContainer: {
-    width: '100%'
-  }
-});
-
-function StepLabel(props) {
-  const {
-    active,
-    alternativeLabel,
-    children,
-    classes,
-    className: classNameProp,
-    completed,
-    disabled,
-    icon,
-    last,
-    optional,
-    orientation
-  } = props,
-        other = _objectWithoutProperties(props, ['active', 'alternativeLabel', 'children', 'classes', 'className', 'completed', 'disabled', 'icon', 'last', 'optional', 'orientation']);
-
-  return React.createElement(
-    'span',
-    _extends({
-      className: classNames(classes.root, classes[orientation], {
-        [classes.disabled]: disabled,
-        [classes.alternativeLabel]: alternativeLabel
-      }, classNameProp)
-    }, other),
-    icon && React.createElement(
-      'span',
-      {
-        className: classNames(classes.iconContainer, {
-          [classes.iconContainerAlternativeLabel]: alternativeLabel
-        })
-      },
-      React.createElement(StepIcon, {
-        completed: completed,
-        active: active,
-        icon: icon,
-        alternativeLabel: alternativeLabel
-      })
-    ),
-    React.createElement(
-      'span',
-      { className: classes.labelContainer },
-      React.createElement(
-        Typography,
-        {
-          variant: 'body1',
-          component: 'span',
-          className: classNames(classes.label, {
-            [classes.labelAlternativeLabel]: alternativeLabel,
-            [classes.labelCompleted]: completed,
-            [classes.labelActive]: active
-          })
-        },
-        children
-      ),
-      optional
-    )
-  );
-}
-
-StepLabel.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * @ignore
-   * Sets the step as active. Is passed to child components.
-   */
-  active: PropTypes.bool,
-  /**
-   * @ignore
-   * Set internally by Stepper when it's supplied with the alternativeLabel property.
-   */
-  alternativeLabel: PropTypes.bool,
-  /**
-   * In most cases will simply be a string containing a title for the label.
-   */
-  children: PropTypes.node,
-  /**
-   * Custom styles for component.
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * @ignore
-   * Mark the step as completed. Is passed to child components.
-   */
-  completed: PropTypes.bool,
-  /**
-   * Mark the step as disabled, will also disable the button if
-   * `StepLabelButton` is a child of `StepLabel`. Is passed to child components.
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Override the default icon.
-   */
-  icon: PropTypes.node,
-  /**
-   * @ignore
-   */
-  last: PropTypes.bool,
-  /**
-   * The optional node to display.
-   */
-  optional: PropTypes.node,
-  /**
-   * @ignore
-   */
-  orientation: PropTypes.oneOf(['horizontal', 'vertical'])
-} : {};
-
-StepLabel.defaultProps = {
-  active: false,
-  alternativeLabel: false,
-  completed: false,
-  disabled: false,
-  last: false,
-  orientation: 'horizontal'
-};
-
-StepLabel.muiName = 'StepLabel';
-
-export default withStyles(styles, { name: 'MuiStepLabel' })(StepLabel);

package/es/Stepper/StepPositionIcon.js

@@ -1,64 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import withStyles from '../styles/withStyles';
-import SvgIcon from '../SvgIcon';
-
-export const styles = theme => ({
-  root: {
-    color: theme.palette.text.disabled
-  },
-  active: {
-    color: theme.palette.primary.main
-  },
-  text: {
-    fill: theme.palette.primary.contrastText,
-    fontSize: theme.typography.caption.fontSize,
-    fontFamily: theme.typography.fontFamily
-  }
-});
-
-/**
- * @ignore - internal component.
- */
-
-var _ref = React.createElement('circle', { cx: '12', cy: '12', r: '12' });
-
-function StepPositionIcon(props) {
-  const { position, classes, className: classNameProp, active } = props;
-  const className = classNames(classes.root, {
-    [classes.active]: active
-  }, classNameProp);
-
-  return React.createElement(
-    SvgIcon,
-    { className: className },
-    _ref,
-    React.createElement(
-      'text',
-      { className: classes.text, x: '12', y: '16', textAnchor: 'middle' },
-      position
-    )
-  );
-}
-
-StepPositionIcon.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * Whether this step is active.
-   */
-  active: PropTypes.bool,
-  /**
-   * Classses for component style customizations.
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * The step position as a number.
-   */
-  position: PropTypes.node
-} : {};
-
-export default withStyles(styles, { name: 'MuiStepPosition' })(StepPositionIcon);

package/es/Stepper/Stepper.js

@@ -1,126 +0,0 @@
-import _extends from 'babel-runtime/helpers/extends';
-import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
-// @inheritedComponent Paper
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import withStyles from '../styles/withStyles';
-import Paper from '../Paper';
-import StepConnector from './StepConnector';
-
-export const styles = theme => ({
-  root: {
-    display: 'flex',
-    padding: theme.spacing.unit * 3
-  },
-  horizontal: {
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  vertical: {
-    flexDirection: 'column'
-  },
-  alternativeLabel: {
-    alignItems: 'flex-start'
-  }
-});
-
-function Stepper(props) {
-  const {
-    activeStep,
-    alternativeLabel,
-    children,
-    classes,
-    className: classNameProp,
-    connector: connectorProp,
-    nonLinear,
-    orientation
-  } = props,
-        other = _objectWithoutProperties(props, ['activeStep', 'alternativeLabel', 'children', 'classes', 'className', 'connector', 'nonLinear', 'orientation']);
-
-  const className = classNames(classes.root, classes[orientation], {
-    [classes.alternativeLabel]: alternativeLabel
-  }, classNameProp);
-
-  const connector = React.isValidElement(connectorProp) ? React.cloneElement(connectorProp, { orientation }) : null;
-  const childrenArray = React.Children.toArray(children);
-  const steps = childrenArray.map((step, index) => {
-    const controlProps = {
-      index,
-      orientation,
-      active: false,
-      completed: false,
-      disabled: false,
-      last: index + 1 === childrenArray.length,
-      alternativeLabel,
-      connector: connectorProp
-    };
-
-    if (activeStep === index) {
-      controlProps.active = true;
-    } else if (!nonLinear && activeStep > index) {
-      controlProps.completed = true;
-    } else if (!nonLinear && activeStep < index) {
-      controlProps.disabled = true;
-    }
-
-    return [!alternativeLabel && connector && index > 0 && React.cloneElement(connector, {
-      key: index // eslint-disable-line react/no-array-index-key
-    }), React.cloneElement(step, _extends({}, controlProps, step.props))];
-  });
-
-  return React.createElement(
-    Paper,
-    _extends({ square: true, elevation: 0, className: className }, other),
-    steps
-  );
-}
-
-Stepper.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * Set the active step (zero based index).
-   */
-  activeStep: PropTypes.number,
-  /**
-   * If set to 'true' and orientation is horizontal,
-   * then the step label will be positioned under the icon.
-   */
-  alternativeLabel: PropTypes.bool,
-  /**
-   * Two or more `<Step />` components.
-   */
-  children: PropTypes.node.isRequired,
-  /**
-   * Useful to extend the style applied to components.
-   */
-  classes: PropTypes.object.isRequired,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * A component to be placed between each step.
-   */
-  connector: PropTypes.element,
-  /**
-   * If set the `Stepper` will not assist in controlling steps for linear flow.
-   */
-  nonLinear: PropTypes.bool,
-  /**
-   * The stepper orientation (layout flow direction).
-   */
-  orientation: PropTypes.oneOf(['horizontal', 'vertical'])
-} : {};
-
-Stepper.defaultProps = {
-  activeStep: 0,
-  alternativeLabel: false,
-  connector: React.createElement(StepConnector, null),
-  nonLinear: false,
-  orientation: 'horizontal'
-};
-
-Stepper.muiName = 'Stepper';
-
-export default withStyles(styles, { name: 'MuiStepper' })(Stepper);

package/es/Stepper/index.js

@@ -1,6 +0,0 @@
-export { default } from './Stepper';
-export { default as Step } from './Step';
-export { default as StepButton } from './StepButton';
-export { default as StepContent } from './StepContent';
-export { default as StepIcon } from './StepIcon';
-export { default as StepLabel } from './StepLabel';