import _extends from "@babel/runtime/helpers/extends";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/Slider/test/Slider.visual.jsx",
  _this = this;
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import React from 'react';
import { storiesOf } from '@storybook/react';
import Slider from '../Slider';
import Box from '../../Box';
import { Cell, Layout } from '../../Layout';
var commonProps = {
  min: 0,
  max: 10,
  value: 4,
  displayMarks: false,
  onChange: function onChange(e) {
    return e;
  },
  direction: 'horizontal'
};
var tests = [{
  describe: 'Horizontal',
  its: [{
    it: 'default',
    props: _objectSpread({}, commonProps)
  }, {
    it: 'disabled',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      disabled: true
    })
  }, {
    it: 'displayMarks',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      displayMarks: true
    })
  }, {
    it: 'step = 2',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      step: 2,
      displayMarks: true
    })
  }, {
    it: 'custom marks',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      marks: {
        0: '$0',
        2: '$79',
        4: '$129',
        6: '$199',
        8: '$349',
        10: '$499'
      },
      displayMarks: true
    })
  }, {
    it: 'start point',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      startPoint: 4,
      displayMarks: true
    })
  }, {
    it: 'has a gradient applied when color name is passed',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'pink'
    })
  }, {
    it: 'has a gradient applied when rgb color code is passed to it',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'rgb(17,122,135)'
    })
  }, {
    it: 'has a gradient applied when hex color code is passed to it',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: '#FFAC89'
    })
  }, {
    it: 'has gradient fall back to blue when incorrect value is passed',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'qwerty'
    })
  }, {
    it: 'has a gradient and is disabled',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'red',
      disabled: true
    })
  }]
}, {
  describe: 'Vertical',
  its: [{
    it: 'default',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      direction: 'vertical'
    })
  }, {
    it: 'disabled',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      disabled: true,
      direction: 'vertical'
    })
  }, {
    it: 'displayMarks',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      displayMarks: true,
      direction: 'vertical'
    })
  }, {
    it: 'step = 2',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      step: 2,
      displayMarks: true,
      direction: 'vertical'
    })
  }, {
    it: 'custom marks',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      marks: {
        0: '$0',
        2: '$79',
        4: '$129',
        6: '$199',
        8: '$349',
        10: '$499'
      },
      displayMarks: true,
      direction: 'vertical'
    })
  }, {
    it: 'start point',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      startPoint: 4,
      displayMarks: true,
      direction: 'vertical'
    })
  }, {
    it: 'is vertical and has a gradient applied when color name is passed',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'pink',
      direction: 'vertical'
    })
  }, {
    it: 'is vertical has a gradient and is disabled',
    props: _objectSpread(_objectSpread({}, commonProps), {}, {
      gradientColor: 'red',
      disabled: true,
      direction: 'vertical'
    })
  }]
}, {
  describe: 'marksLabelAlignment',
  its: [{
    it: 'is horizontal and has marksLabelAlignment set to inline and has displayMarks set to true',
    props: {
      direction: 'horizontal',
      marksLabelAlignment: 'inside',
      displayMarks: true
    }
  }, {
    it: 'is horizontal and has marksLabelAlignment set to inline and has custom marks and has displayMarks set to true',
    props: {
      direction: 'horizontal',
      marksLabelAlignment: 'inside',
      marks: {
        0: '$0',
        2: '$79',
        4: '$129',
        6: '$199',
        8: '$349',
        10: '$499'
      },
      displayMarks: true
    }
  }, {
    it: 'is vertical and has marksLabelAlignment set to inline and has displayMarks set to true',
    props: {
      direction: 'horizontal',
      marksLabelAlignment: 'inside',
      displayMarks: true
    }
  }, {
    it: 'is vertical and has marksLabelAlignment set to inline and has custom marks and has displayMarks set to true',
    props: {
      direction: 'vertical',
      marksLabelAlignment: 'inside',
      marks: {
        0: '$0',
        2: '$79',
        4: '$129',
        6: '$199',
        8: '$349',
        10: '$499'
      },
      displayMarks: true
    }
  }]
}];
tests.forEach(function (_ref) {
  var describe = _ref.describe,
    its = _ref.its;
  its.forEach(function (_ref2) {
    var it = _ref2.it,
      props = _ref2.props;
    storiesOf("Slider".concat(describe ? '/' + describe : ''), module).add(it, function () {
      return /*#__PURE__*/React.createElement(Box, {
        margin: "sp2",
        direction: "vertical",
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 226,
          columnNumber: 7
        }
      }, /*#__PURE__*/React.createElement(Layout, {
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 227,
          columnNumber: 9
        }
      }, [0, 4, 10].map(function (value, key) {
        return /*#__PURE__*/React.createElement(Cell, {
          key: key,
          span: props.direction === 'vertical' ? 3 : 12,
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 229,
            columnNumber: 13
          }
        }, props.direction === 'vertical' ? /*#__PURE__*/React.createElement("div", {
          style: {
            display: 'flex',
            direction: 'column',
            gap: '100px'
          },
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 232,
            columnNumber: 17
          }
        }, _toConsumableArray(Array(2)).map(function (e, i) {
          return /*#__PURE__*/React.createElement("div", {
            key: i,
            style: {
              height: 500
            },
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 236,
              columnNumber: 21
            }
          }, /*#__PURE__*/React.createElement(Slider, _extends({}, commonProps, props, {
            value: value,
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 237,
              columnNumber: 23
            }
          })));
        })) : /*#__PURE__*/React.createElement(React.Fragment, null, _toConsumableArray(Array(2)).map(function (e, i) {
          return /*#__PURE__*/React.createElement("div", {
            key: i,
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 244,
              columnNumber: 21
            }
          }, /*#__PURE__*/React.createElement(Slider, _extends({}, commonProps, props, {
            value: value,
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 245,
              columnNumber: 23
            }
          })));
        })));
      })));
    });
  });
});