"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.tests = exports.suite = void 0;

var React = _interopRequireWildcard(require("react"));

var _index = require("../styles/index.js");

var _index2 = require("./index.js");

var _overrides = require("../helpers/overrides.js");

var _arrowRight = _interopRequireDefault(require("../icon/arrow-right.js"));

var _tests$LIST_EXAMPLE$t;

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var suite = 'Component Test Suite';
exports.suite = suite;
var tests = {
  LIST_EXAMPLE: 'Basic list',
  REMOVABLE_ITEMS_EXAMPLE: 'Removable items',
  VARYING_HEIGHTS_EXAMPLE: 'Varying heights',
  CUSTOM_DRAG_HANDLE_EXAMPLE: 'Custom drag handle',
  STATELESS_LIST_EXAMPLE: 'Stateless list',
  OVERRIDE_LABEL_EXAMPLE: 'Override label'
};
exports.tests = tests;

var List = function List(props) {
  var overrides = props.overrides,
      otherProps = _objectWithoutProperties(props, ["overrides"]);

  var listOverrides = (0, _overrides.mergeOverrides)({
    Root: {
      style: {
        width: '344px'
      }
    }
  }, overrides);
  return React.createElement(_index2.List, _extends({}, otherProps, {
    overrides: listOverrides
  }));
};

var StatefulList = function StatefulList(props) {
  var overrides = props.overrides,
      otherProps = _objectWithoutProperties(props, ["overrides"]);

  var listOverrides = (0, _overrides.mergeOverrides)({
    Root: {
      style: {
        width: '344px'
      }
    }
  }, overrides);
  return React.createElement(_index2.StatefulList, _extends({}, otherProps, {
    overrides: listOverrides
  }));
};

var CustomDragHandleWrapper = (0, _index.styled)('div', function () {
  return {
    marginRight: '1em',
    width: '24px',
    display: 'flex',
    alignItems: 'center'
  };
});
CustomDragHandleWrapper.displayName = "CustomDragHandleWrapper";

var CustomDragHandle = function CustomDragHandle() {
  return React.createElement(CustomDragHandleWrapper, null, React.createElement(_arrowRight.default, {
    size: 24,
    color: "#CCC"
  }));
};

var _default = (_tests$LIST_EXAMPLE$t = {}, _defineProperty(_tests$LIST_EXAMPLE$t, tests.LIST_EXAMPLE, function Story1() {
  return React.createElement(StatefulList, {
    initialState: {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6']
    },
    onChange: console.log // eslint-disable-line no-console

  });
}), _defineProperty(_tests$LIST_EXAMPLE$t, tests.REMOVABLE_ITEMS_EXAMPLE, function Story2() {
  return React.createElement(StatefulList, {
    initialState: {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6']
    },
    removable: true,
    onChange: console.log // eslint-disable-line no-console

  });
}), _defineProperty(_tests$LIST_EXAMPLE$t, tests.VARYING_HEIGHTS_EXAMPLE, function Story3() {
  return React.createElement(StatefulList, {
    initialState: {
      items: ['Lorem ipsum dolor sit amet, consectetur adipiscing elit.', 'Donec ornare.', 'Morbi malesuada id ante ac tincidunt. Phasellus at varius enim, fringilla pretium lorem. Integer placerat, est in aliquam tempus, ex urna hendrerit quam, eu sagittis nulla lorem eu magna.', 'Morbi nibh nunc.', 'Nunc consequat erat id ante mollis tincidunt in a nulla.']
    },
    onChange: console.log // eslint-disable-line no-console

  });
}), _defineProperty(_tests$LIST_EXAMPLE$t, tests.CUSTOM_DRAG_HANDLE_EXAMPLE, function Story4() {
  return React.createElement(StatefulList, {
    initialState: {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6']
    },
    overrides: {
      DragHandle: CustomDragHandle
    },
    onChange: console.log // eslint-disable-line no-console

  });
}), _defineProperty(_tests$LIST_EXAMPLE$t, tests.STATELESS_LIST_EXAMPLE, function Story5() {
  return React.createElement(List, {
    items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6'],
    onChange: console.log // eslint-disable-line no-console

  });
}), _defineProperty(_tests$LIST_EXAMPLE$t, tests.OVERRIDE_LABEL_EXAMPLE, function Story6() {
  return React.createElement(StatefulList, {
    initialState: {
      items: ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6']
    },
    overrides: {
      Label: {
        style: function style(_ref) {
          var $isDragged = _ref.$isDragged;
          return {
            fontSize: $isDragged ? '20px' : null,
            color: $isDragged ? 'darkred' : null
          };
        }
      }
    },
    onChange: console.log // eslint-disable-line no-console

  });
}), _tests$LIST_EXAMPLE$t);

exports.default = _default;