skedify-calendar/lib/es/components/Calendar/Stack.js

Skedify Calendar React component

var _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; };

var _definition;

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

import React from 'react';
import { v4 as uuid } from 'uuid';

export var DIRECTION = {
  HORIZONTAL_REVERSE: uuid(),
  HORIZONTAL: uuid(),
  VERTICAL_REVERSE: uuid(),
  VERTICAL: uuid()
};

export var DISTRIBUTION = {
  AROUND: uuid(),
  BETWEEN: uuid(),
  CENTER: uuid(),
  END: uuid(),
  NORMAL: uuid(),
  START: uuid(),
  STRETCH: uuid()
};

export var ALIGN = {
  CENTER: uuid(),
  END: uuid(),
  NORMAL: uuid(),
  START: uuid()
};

var definition = (_definition = {}, _definition[DIRECTION.HORIZONTAL_REVERSE] = 'row-reverse', _definition[DIRECTION.HORIZONTAL] = 'row', _definition[DIRECTION.VERTICAL_REVERSE] = 'column-reverse', _definition[DIRECTION.VERTICAL] = 'column', _definition[DISTRIBUTION.AROUND] = 'space-around', _definition[DISTRIBUTION.BETWEEN] = 'space-between', _definition[DISTRIBUTION.CENTER] = 'center', _definition[DISTRIBUTION.END] = 'flex-end', _definition[DISTRIBUTION.NORMAL] = 'normal', _definition[DISTRIBUTION.START] = 'flex-start', _definition[DISTRIBUTION.STRETCH] = 'stretch', _definition[ALIGN.CENTER] = 'center', _definition[ALIGN.END] = 'flex-end', _definition[ALIGN.NORMAL] = 'normal', _definition[ALIGN.START] = 'flex-start', _definition);

var Stack = React.forwardRef(function (props, ref) {
  var children = props.children,
      _props$direction = props.direction,
      direction = _props$direction === undefined ? Stack.direction.HORIZONTAL : _props$direction,
      _props$distribution = props.distribution,
      distribution = _props$distribution === undefined ? Stack.distribution.BETWEEN : _props$distribution,
      _props$align = props.align,
      align = _props$align === undefined ? Stack.align.CENTER : _props$align,
      style = props.style,
      rest = _objectWithoutProperties(props, ['children', 'direction', 'distribution', 'align', 'style']);

  return React.createElement(
    'div',
    _extends({
      ref: ref,
      style: _extends({}, style, {
        display: 'flex',
        flexDirection: definition[direction],
        justifyContent: definition[distribution],
        alignItems: definition[align]
      })
    }, rest),
    children
  );
});

export { Stack };
Stack.direction = DIRECTION;
Stack.distribution = DISTRIBUTION;
Stack.align = ALIGN;

Stack.displayName = 'Stack';