"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _react2 = require("@storybook/react");
var _StatisticsWidget = _interopRequireDefault(require("../StatisticsWidget"));
var _constants = require("../constants");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/StatisticsWidget/test/StatisticsWidget.visual.jsx",
  _this = void 0;
var sizes = Object.values(_constants.SIZES);
var tests = [{
  describe: 'sanity',
  its: [{
    it: '3 items',
    props: {
      items: [{
        value: '$7,500',
        description: 'Monday',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '1 200 000',
        description: 'Tuesday',
        descriptionInfo: 'Sales on Tuesday',
        percentage: 11
      }, {
        value: '21k',
        description: 'Wednesday'
      }]
    }
  }, {
    it: '5 items',
    props: {
      items: [{
        value: '$500',
        description: 'Monday',
        percentage: 21
      }, {
        value: '$1,500',
        description: 'Tuesday',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '$2,500',
        percentage: -11
      }, {
        value: '$3,500',
        description: 'Thursday',
        percentage: -11,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '0',
        description: 'Friday',
        percentage: 0,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Friday'
      }]
    }
  }, {
    it: '> 5 items',
    props: {
      items: [{
        value: '$500',
        description: 'Monday'
      }, {
        value: '$1,500',
        description: 'Tuesday',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '$2,500',
        percentage: 11
      }, {
        value: '$3,500',
        description: 'Thursday',
        percentage: 0,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '$4,500',
        description: 'Friday',
        descriptionInfo: 'Sales on Friday'
      }, {
        value: '$5,500',
        description: 'Saturday',
        percentage: 0
      }]
    }
  }]
}, {
  describe: 'title',
  its: [{
    it: 'without short text in a value',
    props: {
      items: [{
        value: '$7,500,000,000'
      }, {
        value: '$1,200,000'
      }, {
        value: '$1,872'
      }, {
        value: 'Testing very very long text'
      }]
    }
  }, {
    it: 'with tiny values',
    props: {
      size: 'tiny',
      items: [{
        value: '$7,500,000,000'
      }, {
        value: '$1,200,000'
      }, {
        value: '$1,872'
      }]
    }
  }, {
    it: 'with items alignment to start',
    props: {
      size: 'tiny',
      alignItems: 'start',
      items: [{
        value: '$7,500,'
      }, {
        value: '$1,200'
      }, {
        value: '$1,872'
      }]
    }
  }, {
    it: 'with short text in a value',
    props: {
      items: [{
        value: '$7,500,000,000',
        valueInShort: '$7,5B'
      }, {
        value: '$1,200,000',
        valueInShort: '$1,2M'
      }, {
        value: '$1,872',
        valueInShort: '$1,8K'
      }, {
        value: 'Testing very very long text',
        valueInShort: 'Text'
      }]
    }
  }, {
    it: 'empty values',
    props: {
      items: [{
        description: 'Sales'
      }, {
        description: 'Views'
      }, {
        description: 'Revenues'
      }]
    }
  }]
}, {
  describe: 'description',
  its: [{
    it: 'extra long description',
    props: {
      items: [{
        value: '$1,000',
        description: 'The income out of trading goods on Monday',
        descriptionInfo: 'Sales on Monday'
      }, {
        value: '$2,000',
        description: 'The income out of trading goods on Tuesday'
      }, {
        value: '$3,000',
        description: 'The income out of trading goods on Wednesday'
      }, {
        value: '$4,000',
        description: 'The income out of trading goods on Thursday',
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '$4,000',
        description: 'The income out of trading goods on Friday'
      }]
    }
  }, {
    it: 'Info icons',
    props: {
      items: [{
        value: '$500',
        description: 'Monday',
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '$1,500',
        descriptionInfo: 'I am not visible because there is no description'
      }, {
        value: '$2,500',
        description: 'Wednesday',
        descriptionInfo: 'Sales on Wednesday'
      }, {
        value: '$2,500',
        description: 'The income out of trading goods on Thursday',
        descriptionInfo: 'Sales on Wednesday'
      }, {
        value: '$4,250,000,000',
        valueInShort: '$4,3B',
        description: 'The income out of trading goods on Friday'
      }]
    }
  }, {
    it: 'empty values',
    props: {
      items: [{
        description: 'Views'
      }, {
        description: 'Likes'
      }, {
        description: 'Revenue'
      }]
    }
  }, {
    it: 'With tiny values',
    props: {
      size: 'tiny',
      items: [{
        value: '$500',
        description: 'Monday',
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '$1,500',
        descriptionInfo: 'I am not visible because there is no description'
      }, {
        value: '$2,500',
        description: 'Wednesday',
        descriptionInfo: 'Sales on Wednesday'
      }, {
        value: '$2,500',
        description: 'The income out of trading goods on Thursday',
        descriptionInfo: 'Sales on Wednesday'
      }, {
        value: '$4,250,000,000',
        valueInShort: '$4,3B',
        description: 'The income out of trading goods on Friday'
      }]
    }
  }]
}, {
  describe: 'trends',
  its: [{
    it: 'trends and inverted trends',
    props: {
      items: [{
        value: '$500',
        description: 'Monday',
        percentage: 21
      }, {
        value: '$1,500',
        description: 'Tuesday',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '$2,500',
        percentage: -11
      }, {
        value: '$3,500',
        description: 'Thursday',
        percentage: -11,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Thursday'
      }, {
        value: '0',
        description: 'Friday',
        percentage: 0,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Friday'
      }]
    }
  }]
}, {
  describe: 'children',
  its: [{
    it: 'renders children',
    props: {
      items: [{
        value: '100',
        description: 'Money',
        children: /*#__PURE__*/_react["default"].createElement("div", {
          __self: void 0,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 375,
            columnNumber: 25
          }
        }, "That's a lot")
      }]
    }
  }]
}, {
  describe: 'size',
  its: sizes.map(function (size) {
    return {
      it: size,
      props: {
        size: size,
        items: [{
          value: '1,500',
          description: 'Orders',
          percentage: 21,
          invertedPercentage: true
        }, {
          value: '$2,500',
          description: 'Outcome',
          percentage: -11
        }, {
          value: '$3,500',
          description: 'Revenue',
          percentage: -11,
          invertedPercentage: true,
          descriptionInfo: 'Sales on Thursday'
        }]
      }
    };
  })
}, {
  describe: 'isLoading',
  its: [{
    it: 'renders a loader aligned to start',
    props: {
      isLoading: true,
      alignItems: 'start',
      items: [{
        value: '1,500',
        description: 'Orders',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '$2,500',
        description: 'Outcome',
        percentage: -11
      }, {
        value: '$3,500',
        description: 'Revenue',
        percentage: -11,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Thursday'
      }]
    }
  }]
}];
tests.forEach(function (_ref) {
  var describe = _ref.describe,
    its = _ref.its;
  its.forEach(function (_ref2) {
    var it = _ref2.it,
      props = _ref2.props;
    (0, _react2.storiesOf)("StatisticsWidget".concat(describe ? '/' + describe : ''), module).add(it, function () {
      return /*#__PURE__*/_react["default"].createElement("div", {
        style: {
          marginLeft: 100,
          marginTop: 100
        },
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 450,
          columnNumber: 9
        }
      }, /*#__PURE__*/_react["default"].createElement(_StatisticsWidget["default"], (0, _extends2["default"])({}, props, {
        __self: _this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 451,
          columnNumber: 11
        }
      })));
    });
  });
});
[{
  props: {},
  it: 'default (tiny)'
}, {
  props: {
    size: 'tiny'
  },
  it: 'tiny'
}, {
  props: {
    size: 'large'
  },
  it: 'large'
}].forEach(function (_ref3) {
  var props = _ref3.props,
    it = _ref3.it;
  (0, _react2.storiesOf)("Layout And Spacing| StatisticsWidget/size", module).add(it, function () {
    return /*#__PURE__*/_react["default"].createElement("div", {
      style: {
        marginLeft: 100,
        marginTop: 100
      },
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 473,
        columnNumber: 5
      }
    }, /*#__PURE__*/_react["default"].createElement(_StatisticsWidget["default"], (0, _extends2["default"])({
      items: [{
        value: '1,500',
        description: 'Orders',
        percentage: 21,
        invertedPercentage: true
      }, {
        value: '$2,500',
        description: 'Outcome',
        percentage: -11
      }, {
        value: '$3,500',
        description: 'Revenue',
        percentage: -11,
        invertedPercentage: true,
        descriptionInfo: 'Sales on Thursday'
      }]
    }, props, {
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 474,
        columnNumber: 7
      }
    })));
  });
});