@wix/design-system/dist/cjs/AreaChart/docs/index.story.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _react = _interopRequireDefault(require("react"));
var _Sections = require("@wix/wix-storybook-utils/Sections");
var _storySettings = require("../test/storySettings");
var _examples = require("./examples");
var _ = _interopRequireDefault(require(".."));
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/AreaChart/docs/index.story.jsx";
var _default = exports["default"] = {
  category: _storySettings.storySettings.category,
  storyName: 'AreaChart',
  component: _["default"],
  componentPath: '..',
  componentProps: {
    data: _examples.combinedData,
    tooltipContent: function tooltipContent(item, index) {
      return ["".concat(item.label), "".concat(item.value, "$ from your orders")];
    }
  },
  exampleProps: {
    // Put here presets of props, for more info:
    // https://github.com/wix/wix-ui/blob/master/packages/wix-storybook-utils/docs/usage.md
  },
  sections: [(0, _Sections.header)({
    sourceUrl: "https://github.com/wix-private/wix-design-systems/tree/master/packages/wix-design-system/src/".concat(_["default"].displayName, "/"),
    component: /*#__PURE__*/_react["default"].createElement(_["default"], {
      data: _examples.standardData,
      tooltipContent: function tooltipContent(item, index) {
        return ["".concat(item.label), "".concat(item.value, "$ from your orders")];
      },
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 51,
        columnNumber: 9
      }
    })
  }), (0, _Sections.tabs)([(0, _Sections.tab)({
    title: 'Description',
    sections: [(0, _Sections.description)({
      title: 'Description',
      text: 'An area chart is a way of plotting data points on a line. Often, it is used to show trend data.'
    }), (0, _Sections.divider)(), (0, _Sections.title)('Examples'), (0, _Sections.example)({
      title: 'Simple Usage',
      text: 'A simple example with compact preview',
      source: _examples.simpleUsage
    }), (0, _Sections.example)({
      title: 'Collapsed values',
      text: 'A simple example of collapsed values (hover on a point between some x labels)',
      source: _examples.collapsedLabelsUsage
    }), (0, _Sections.code)({
      title: 'Full Interactive Preview',
      description: 'A non compact version of same code example as above',
      source: _examples.simpleUsage
    })]
  })].concat((0, _toConsumableArray2["default"])([{
    title: 'API',
    sections: [(0, _Sections.api)()]
  }, {
    title: 'Testkit',
    sections: [(0, _Sections.testkit)()]
  }, {
    title: 'Playground',
    sections: [(0, _Sections.playground)()]
  }].map(_Sections.tab))))]
};