How to use the react-transition-group/Transition.defaultProps function in react-transition-group

To help you get started, we’ve selected a few react-transition-group examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github italia / design-react-kit / dist / design-react-kit.es.js View on Github external
var TransitionTimeouts = Util.TransitionTimeouts,
    TransitionPropTypeKeys = Util.TransitionPropTypeKeys,
    TransitionStatuses = Util.TransitionStatuses,
    pick = Util.pick,
    omit = Util.omit;

var propTypes$2 = _extends({}, Transition.propTypes, {
  // eslint-disable-line react/forbid-foreign-prop-types
  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
  className: PropTypes.string,
  active: PropTypes.bool,
  onToggle: PropTypes.func
});

var defaultProps$2 = _extends({}, Transition.defaultProps, {
  timeout: TransitionTimeouts.Collapse,
  tag: 'div'
});

var transitionStatusToClassHash = (_transitionStatusToCl = {}, _transitionStatusToCl[TransitionStatuses.ENTERING] = 'collapsing', _transitionStatusToCl[TransitionStatuses.ENTERED] = 'collapse show', _transitionStatusToCl[TransitionStatuses.EXITING] = 'collapsing', _transitionStatusToCl[TransitionStatuses.EXITED] = 'collapse', _transitionStatusToCl);

function getTransitionClass(status) {
  return transitionStatusToClassHash[status] || 'collapse';
}

function getHeight(node) {
  return node.scrollHeight;
}

var AccordionBody =
/*#__PURE__*/
github bootstrap-styled / v4 / src / Modal / Fade.js View on Github external
export const propTypes = {
  ...Transition.propTypes, // eslint-disable-line react/forbid-foreign-prop-types
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node,
  ]),
  tag: PropTypes.any,
  baseClass: PropTypes.string,
  baseClassActive: PropTypes.string,
  className: PropTypes.string,
  cssModule: PropTypes.object,
};

export const defaultProps = {
  ...Transition.defaultProps,
  tag: 'div',
  baseClass: 'fade',
  baseClassActive: 'show',
  timeout: 150,
  appear: true,
  enter: true,
  exit: true,
  in: true,
};

function Fade(props) {
  const {
    tag: Tag,
    baseClass,
    baseClassActive,
    className,
github italia / design-react-kit / src / components / Collapse / Collapse.js View on Github external
const propTypes = {
  ...Transition.propTypes, // eslint-disable-line react/forbid-foreign-prop-types
  isOpen: PropTypes.bool,
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node
  ]),
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
  className: PropTypes.node,
  navbar: PropTypes.bool,
  cssModule: PropTypes.object
}

const defaultProps = {
  ...Transition.defaultProps,
  isOpen: false,
  appear: false,
  enter: true,
  exit: true,
  tag: 'div',
  timeout: TransitionTimeouts.Collapse
}

const transitionStatusToClassHash = {
  [TransitionStatuses.ENTERING]: 'collapsing',
  [TransitionStatuses.ENTERED]: 'collapse show',
  [TransitionStatuses.EXITING]: 'collapsing',
  [TransitionStatuses.EXITED]: 'collapse'
}

function getTransitionClass(status) {
github italia / design-react-kit / src / components / Offcanvas / Offcanvas.js View on Github external
} = Util

const propTypes = {
  ...Transition.propTypes, // eslint-disable-line react/forbid-foreign-prop-types
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node
  ]),
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
  className: PropTypes.string,
  onClose: PropTypes.func,
  isOpen: PropTypes.bool
}

const defaultProps = {
  ...Transition.defaultProps,
  timeout: TransitionTimeouts.Collapse,
  tag: 'div'
}

const transitionStatusToClassHash = {
  [TransitionStatuses.ENTERING]: 'navbar-collapsable d-block',
  [TransitionStatuses.ENTERED]: 'navbar-collapsable d-block expanded',
  [TransitionStatuses.EXITING]: 'navbar-collapsable d-block',
  [TransitionStatuses.EXITED]: 'navbar-collapsable'
}

const defaultStyle = {
  transition: '400ms ease-in-out',
  transitionProperty: 'opacity'
}
github italia / design-react-kit / src / components / Accordion / AccordionBody.js View on Github external
} = Util

const propTypes = {
  ...Transition.propTypes, // eslint-disable-line react/forbid-foreign-prop-types
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node
  ]),
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
  className: PropTypes.string,
  active: PropTypes.bool,
  onToggle: PropTypes.func
}

const defaultProps = {
  ...Transition.defaultProps,
  timeout: TransitionTimeouts.Collapse,
  tag: 'div'
}

const transitionStatusToClassHash = {
  [TransitionStatuses.ENTERING]: 'collapsing',
  [TransitionStatuses.ENTERED]: 'collapse show',
  [TransitionStatuses.EXITING]: 'collapsing',
  [TransitionStatuses.EXITED]: 'collapse'
}

function getTransitionClass(status) {
  return transitionStatusToClassHash[status] || 'collapse'
}

function getHeight(node) {
github xDae / styled-bootstrap / src / Collapse / index.js View on Github external
>
        {status => {
          const style = height === null ? null : { height };
          return (
            
              {children}
            
          );
        }}
      
    );
  }
}

Collapse.defaultProps = {
  ...Transition.defaultProps,
  isOpen: false,
  timeout: TransitionTimeouts.Collapse
};

Collapse.propTypes = {
  ...Transition.propTypes,
  isOpen: PropTypes.bool,
  children: PropTypes.oneOfType([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node
  ])
};

export default Collapse;