"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.ListWithDifferentArrowPositions = exports.ItemSelected = exports.ItemDisabled = exports.ItemDefault = void 0;
var _react = _interopRequireDefault(require("react"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _MultiSelectList = require("./MultiSelectList");
var _Display = require("../../../../../common/Display");
var _2 = require("../../../../..");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Molecules / Input / Select / MultiSelectList'
};
var ItemDefault = exports.ItemDefault = {
  render: function render() {
    return _react.default.createElement(_MultiSelectList.Option, {
      label: "First"
    });
  },
  name: 'Item default'
};
var ItemSelected = exports.ItemSelected = {
  render: function render() {
    return _react.default.createElement(_MultiSelectList.Option, {
      label: "First",
      selected: true
    });
  },
  name: 'Item selected'
};
var ItemDisabled = exports.ItemDisabled = {
  render: function render() {
    return _react.default.createElement(_MultiSelectList.Option, {
      label: "First",
      disabled: true
    });
  },
  name: 'Item disabled'
};
var DropdownBubbleWithPadding = (0, _styledComponents.default)(_2.DropdownBubble).withConfig({
  displayName: "MultiSelectListstories__DropdownBubbleWithPadding",
  componentId: "sc-1qucl28-0"
})(["padding-top:12px;padding-bottom:12px;width:300px;"]);
var Wrapper = function Wrapper(props) {
  return _react.default.createElement(DropdownBubbleWithPadding, {
    position: props.position,
    placement: props.placement,
    maxHeight: "200px"
  }, _react.default.createElement(_2.FadedScroll, {
    enableMobileFade: true
  }, props.children));
};
var ListWithDifferentArrowPositions = exports.ListWithDifferentArrowPositions = {
  render: function render() {
    var _Array$fill, _Array$fill2, _Array$fill3, _Array$fill4, _Array$fill5, _Array$fill6;
    return _react.default.createElement(_Display.Display, {
      items: [{
        component: _react.default.createElement(Wrapper, {
          position: "left"
        }, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), (_Array$fill = new Array(10).fill(null)) === null || _Array$fill === void 0 ? void 0 : _Array$fill.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Bottom, Arrow Default (Left)'
      }, {
        component: _react.default.createElement(Wrapper, null, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "SecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecond"
        }), (_Array$fill2 = new Array(10).fill(null)) === null || _Array$fill2 === void 0 ? void 0 : _Array$fill2.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Bottom, Arrow Right'
      }, {
        component: _react.default.createElement(Wrapper, {
          position: "center"
        }, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "Second"
        }), (_Array$fill3 = new Array(10).fill(null)) === null || _Array$fill3 === void 0 ? void 0 : _Array$fill3.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Bottom, Arrow Center'
      }, {
        component: _react.default.createElement(Wrapper, {
          placement: "top"
        }, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "SecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecondSecond"
        }), (_Array$fill4 = new Array(10).fill(null)) === null || _Array$fill4 === void 0 ? void 0 : _Array$fill4.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Top, Arrow Default (right)'
      }, {
        component: _react.default.createElement(Wrapper, {
          position: "left",
          placement: "top"
        }, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), (_Array$fill5 = new Array(10).fill(null)) === null || _Array$fill5 === void 0 ? void 0 : _Array$fill5.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Top, Arrow Left'
      }, {
        component: _react.default.createElement(Wrapper, {
          position: "center",
          placement: "top"
        }, _react.default.createElement(_MultiSelectList.Option, {
          label: "Default?"
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "First",
          selected: true
        }), _react.default.createElement(_MultiSelectList.Option, {
          label: "Second"
        }), (_Array$fill6 = new Array(10).fill(null)) === null || _Array$fill6 === void 0 ? void 0 : _Array$fill6.map(function (_, i) {
          return _react.default.createElement(_MultiSelectList.Option, {
            key: i,
            label: "Disabled",
            disabled: true
          });
        })),
        title: 'Placement Top, Arrow Center'
      }]
    });
  }
};