@pingux/astro 2.20.0-alpha.1 → 2.20.0-alpha.11

package/lib/cjs/recipes/RowLineChart.stories.js

@@ -1,578 +0,0 @@
-"use strict";
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactAria = require("react-aria");
-var _addonActions = require("@storybook/addon-actions");
-var _recharts = require("recharts");
-var _useResizeObserver2 = _interopRequireDefault(require("use-resize-observer"));
-var _index = require("../index");
-var _colors = require("../styles/colors");
-var _react2 = require("@emotion/react");
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-var _default = {
-  title: 'Recipes/Row Line Chart',
-  parameters: {
-    chromatic: {
-      diffThreshold: 0.9
-    }
-  }
-};
-exports["default"] = _default;
-var chartData = [{
-  id: 1,
-  emptyData: 0,
-  fullData: 1
-}, {
-  id: 2,
-  emptyData: 0,
-  fullData: 5
-}, {
-  id: 3,
-  emptyData: 0,
-  fullData: 3
-}, {
-  id: 4,
-  emptyData: 0,
-  fullData: 2
-}, {
-  id: 5,
-  emptyData: 0,
-  fullData: 5
-}, {
-  id: 6,
-  emptyData: 0,
-  fullData: 1
-}, {
-  id: 7,
-  emptyData: 0,
-  fullData: 5
-}, {
-  id: 8,
-  emptyData: 0,
-  fullData: 5
-}, {
-  id: 9,
-  emptyData: 0,
-  fullData: 1
-}, {
-  id: 10,
-  emptyData: 0,
-  fullData: 2
-}, {
-  id: 11,
-  emptyData: 0,
-  fullData: 4
-}, {
-  id: 12,
-  emptyData: 0,
-  fullData: 11
-}];
-var partialDataData = [{
-  id: 1
-}, {
-  id: 2
-}, {
-  id: 3
-}, {
-  id: 4
-}, {
-  id: 5
-}, {
-  id: 6
-}, {
-  id: 7,
-  value: 6
-}, {
-  id: 8,
-  value: 5
-}, {
-  id: 9,
-  value: 4
-}, {
-  id: 10,
-  value: 3
-}, {
-  id: 11,
-  value: 2
-}, {
-  id: 12,
-  value: 1
-}];
-var zeroValuesData = [{
-  id: 1,
-  value: 0
-}, {
-  id: 2,
-  value: 0
-}, {
-  id: 3,
-  value: 0
-}, {
-  id: 4,
-  value: 0
-}];
-var zeroData = [{
-  id: 1
-}, {
-  id: 2
-}, {
-  id: 3
-}, {
-  id: 4
-}, {
-  id: 5
-}, {
-  id: 6
-}, {
-  id: 7
-}, {
-  id: 8,
-  value: 0
-}, {
-  id: 9,
-  value: 0
-}, {
-  id: 10,
-  value: 0
-}, {
-  id: 11,
-  value: 0
-}, {
-  id: 12,
-  value: 0
-}];
-var expandableRowSharedStyle = {
-  textOverflow: 'ellipsis',
-  overflow: 'hidden',
-  whiteSpace: 'nowrap'
-};
-var alignCellRightWrapper = {
-  display: 'flex',
-  flexDirection: 'column',
-  alignItems: 'flex-end'
-};
-var sx = {
-  container: {
-    backgroundColor: 'accent.99',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    pr: '20px'
-  },
-  chartTitleContainer: {},
-  chartContainer: {
-    width: '100%',
-    height: '100%'
-  },
-  chart: {
-    width: '50',
-    height: '18'
-  },
-  chartTrendContainer: {
-    ml: 'md',
-    width: '50px'
-  },
-  expandableRow: {
-    titleWrapper: {
-      maxWidth: '50%',
-      p: 'md'
-    },
-    lineChart: {
-      title: _objectSpread(_objectSpread({}, alignCellRightWrapper), {}, {
-        ml: '20px',
-        pr: 'md'
-      }),
-      content: _objectSpread(_objectSpread({}, alignCellRightWrapper), {}, {
-        width: 100
-      }),
-      chart: {
-        width: '50px',
-        height: '18px'
-      },
-      chartWrapper: {
-        '&:hover': {
-          backgroundColor: '#4462ED1A'
-        }
-      },
-      divider: {
-        backgroundColor: 'neutral.80',
-        height: '35px',
-        width: '1px'
-      }
-    }
-  },
-  expandableRowButton: {
-    chartWrapper: {
-      display: 'flex',
-      flexDirection: 'row',
-      alignItems: 'center',
-      color: 'black',
-      background: 'none',
-      cursor: 'pointer',
-      height: 60,
-      padding: 0,
-      ml: 'md',
-      pr: 'md',
-      border: 'none',
-      '&:hover': {
-        backgroundColor: '#4462ED1A'
-      }
-    }
-  },
-  expandableRowText: {
-    title: _objectSpread({
-      fontSize: 'lg',
-      color: 'neutral.20'
-    }, expandableRowSharedStyle),
-    subtitle: _objectSpread({
-      fontSize: 'sm',
-      color: 'neutral.60'
-    }, expandableRowSharedStyle),
-    lineChart: {
-      title: _objectSpread({
-        fontSize: 'sm',
-        color: 'neutral.40',
-        maxWidth: '100%'
-      }, expandableRowSharedStyle),
-      count: {
-        color: 'neutral.20',
-        fontSize: 22,
-        fontWeight: 2
-      },
-      countLabel: {
-        fontSize: 'xs',
-        color: 'neutral.50'
-      },
-      chartLabel: {
-        fontSize: 'xs',
-        color: 'neutral.50',
-        minWidth: '60px'
-      },
-      trend: {
-        color: 'neutral.20',
-        fontSize: 'sm',
-        fontWeight: 3,
-        whiteSpace: 'nowrap'
-      }
-    }
-  }
-};
-var Default = function Default() {
-  var _useResizeObserver = (0, _useResizeObserver2["default"])(),
-    ref = _useResizeObserver.ref,
-    width = _useResizeObserver.width;
-  var _useVisuallyHidden = (0, _reactAria.useVisuallyHidden)(),
-    visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
-  var isTablet = (0, _react.useMemo)(function () {
-    return width <= 605;
-  }, [width]);
-  var isMobile = (0, _react.useMemo)(function () {
-    return width <= 350;
-  }, [width]);
-  var hideIfTablet = (0, _react.useCallback)(function () {
-    return isTablet && visuallyHiddenProps;
-  }, [isTablet]);
-  var hideIfMobile = (0, _react.useCallback)(function () {
-    return isMobile && visuallyHiddenProps;
-  }, [isMobile]);
-  var EmptyData = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    sx: sx.container,
-    ref: ref
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.titleWrapper
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.title
-  }, "Expanded Row with Line Chart"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.subtitle
-  }, "Empty Data")), (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    alignItems: "center"
-  }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.title
-  }, hideIfMobile()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.title
-  }, "Avg daily sign-ons:")), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.content
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.count
-  }, "0"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.countLabel
-  }, "Past 7 days")), (0, _react2.jsx)(_index.TooltipTrigger, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
-    sx: sx.expandableRowButton.chartWrapper,
-    onPress: (0, _addonActions.action)('seeContributingDataAction'),
-    "aria-label": "line-chart button"
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.divider
-  }), (0, _react2.jsx)(_index.Box, {
-    ml: 15
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.chart
-  }, (0, _react2.jsx)(_recharts.ResponsiveContainer, {
-    sx: sx.chartContainer
-  }, (0, _react2.jsx)(_recharts.LineChart, {
-    sx: sx.chart,
-    data: chartData
-  }, (0, _react2.jsx)(_recharts.Line, {
-    type: "monotone",
-    dataKey: "emptyData",
-    dot: false,
-    stroke: _colors.neutral[20]
-  })))), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.chartLabel
-  }, "No data yet")), (0, _react2.jsx)(_index.Box, {
-    size: "sm",
-    sx: sx.chartTrendContainer
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.trend
-  }, "+ 0%"))), (0, _react2.jsx)(_index.Tooltip, null, "See Contributing Data")), (0, _react2.jsx)(_index.Box, {
-    size: "sm"
-  }, (0, _react2.jsx)(_index.SwitchField, {
-    "aria-label": "line-chart switch-field"
-  }))));
-  var FullData = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    sx: sx.container,
-    mt: 20
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.titleWrapper
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.title
-  }, "Expanded Row with Line Chart"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.subtitle
-  }, "Full Data")), (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    alignItems: "center"
-  }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.title
-  }, hideIfMobile()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.title
-  }, "Avg daily sign-ons:")), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.content
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.count
-  }, "1,234,234"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.countLabel
-  }, "Past 7 days")), (0, _react2.jsx)(_index.TooltipTrigger, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
-    sx: sx.expandableRowButton.chartWrapper,
-    onPress: (0, _addonActions.action)('seeContributingDataAction'),
-    "aria-label": "line-chart button"
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.divider
-  }), (0, _react2.jsx)(_index.Box, {
-    ml: 15
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.chart,
-    width: 50
-  }, (0, _react2.jsx)(_recharts.ResponsiveContainer, {
-    sx: sx.chartContainer
-  }, (0, _react2.jsx)(_recharts.LineChart, {
-    sx: sx.chart,
-    data: chartData
-  }, (0, _react2.jsx)(_recharts.Line, {
-    type: "monotone",
-    dataKey: "fullData",
-    dot: false,
-    stroke: _colors.neutral[20]
-  })))), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.chartLabel
-  }, "12 wk trend")), (0, _react2.jsx)(_index.Box, {
-    size: "sm",
-    sx: sx.chartTrendContainer
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.trend
-  }, "+ 8.6%"))), (0, _react2.jsx)(_index.Tooltip, null, "See Contributing Data")), (0, _react2.jsx)(_index.Box, {
-    size: "sm"
-  }, (0, _react2.jsx)(_index.SwitchField, {
-    "aria-label": "line-chart switch-field"
-  }))));
-  var PartialData = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    sx: sx.container,
-    mt: 20
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.titleWrapper
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.title
-  }, "Expanded Row with Line Chart"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.subtitle
-  }, "Partial Data")), (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    alignItems: "center"
-  }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.title
-  }, hideIfMobile()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.title
-  }, "Avg daily sign-ons:")), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.content
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.count
-  }, "234,234"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.countLabel
-  }, "Past 7 days")), (0, _react2.jsx)(_index.TooltipTrigger, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
-    sx: sx.expandableRowButton.chartWrapper,
-    onPress: (0, _addonActions.action)('seeContributingDataAction'),
-    "aria-label": "line-chart button"
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.divider
-  }), (0, _react2.jsx)(_index.Box, {
-    ml: 15
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.chart,
-    width: 50
-  }, (0, _react2.jsx)(_recharts.ResponsiveContainer, {
-    sx: sx.chartContainer
-  }, (0, _react2.jsx)(_recharts.LineChart, {
-    sx: sx.chart,
-    data: partialDataData
-  }, (0, _react2.jsx)(_recharts.Line, {
-    type: "monotone",
-    dataKey: "value",
-    dot: false,
-    stroke: _colors.neutral[20]
-  })))), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.chartLabel
-  }, "12 wk trend")), (0, _react2.jsx)(_index.Box, {
-    size: "sm",
-    sx: sx.chartTrendContainer
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.trend
-  }, "- 8.6%"))), (0, _react2.jsx)(_index.Tooltip, null, "See Contributing Data")), (0, _react2.jsx)(_index.Box, {
-    size: "sm"
-  }, (0, _react2.jsx)(_index.SwitchField, {
-    "aria-label": "line-chart switch-field"
-  }))));
-  var ZeroData = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    sx: sx.container,
-    mt: 20
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.titleWrapper
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.title
-  }, "Expanded Row with Line Chart"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.subtitle
-  }, "Zero Data")), (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    alignItems: "center"
-  }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.title
-  }, hideIfMobile()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.title
-  }, "Avg daily sign-ons:")), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.content
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.count
-  }, "0"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.countLabel
-  }, "Past 7 days")), (0, _react2.jsx)(_index.TooltipTrigger, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
-    sx: sx.expandableRowButton.chartWrapper,
-    onPress: (0, _addonActions.action)('seeContributingDataAction'),
-    "aria-label": "line-chart button"
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.divider
-  }), (0, _react2.jsx)(_index.Box, {
-    ml: 15
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.chart,
-    width: 50
-  }, (0, _react2.jsx)(_recharts.ResponsiveContainer, {
-    sx: sx.chartContainer
-  }, (0, _react2.jsx)(_recharts.LineChart, {
-    sx: sx.chart,
-    data: zeroData
-  }, (0, _react2.jsx)(_recharts.Line, {
-    type: "monotone",
-    dataKey: "value",
-    dot: false,
-    stroke: _colors.neutral[20]
-  })))), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.chartLabel
-  }, "12 wk trend")), (0, _react2.jsx)(_index.Box, {
-    size: "sm",
-    sx: sx.chartTrendContainer
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.trend
-  }, "+ 0%"))), (0, _react2.jsx)(_index.Tooltip, null, "See Contributing Data")), (0, _react2.jsx)(_index.Box, {
-    size: "sm"
-  }, (0, _react2.jsx)(_index.SwitchField, {
-    "aria-label": "line-chart switch-field"
-  }))));
-  var ZeroValues = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    sx: sx.container,
-    mt: 20
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.titleWrapper
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.title
-  }, "Expanded Row with Line Chart"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.subtitle
-  }, "Zero Values")), (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    alignItems: "center"
-  }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.title
-  }, hideIfMobile()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.title
-  }, "Avg daily sign-ons:")), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    sx: sx.expandableRow.lineChart.content
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.count
-  }, "0"), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.countLabel
-  }, "Past 7 days")), (0, _react2.jsx)(_index.TooltipTrigger, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
-    sx: sx.expandableRowButton.chartWrapper,
-    onPress: (0, _addonActions.action)('seeContributingDataAction'),
-    "aria-label": "line-chart button"
-  }, hideIfTablet()), (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.divider
-  }), (0, _react2.jsx)(_index.Box, {
-    ml: 15
-  }, (0, _react2.jsx)(_index.Box, {
-    sx: sx.expandableRow.lineChart.chart,
-    width: 50
-  }, (0, _react2.jsx)(_recharts.ResponsiveContainer, {
-    sx: sx.chartContainer
-  }, (0, _react2.jsx)(_recharts.LineChart, {
-    sx: sx.chart,
-    data: zeroValuesData
-  }, (0, _react2.jsx)(_recharts.Line, {
-    type: "monotone",
-    dataKey: "value",
-    dot: false,
-    stroke: _colors.neutral[20]
-  })))), (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.chartLabel
-  }, "12 wk trend")), (0, _react2.jsx)(_index.Box, {
-    size: "sm",
-    sx: sx.chartTrendContainer
-  }, (0, _react2.jsx)(_index.Text, {
-    sx: sx.expandableRowText.lineChart.trend
-  }, "+ 0%"))), (0, _react2.jsx)(_index.Tooltip, null, "See Contributing Data")), (0, _react2.jsx)(_index.Box, {
-    size: "sm"
-  }, (0, _react2.jsx)(_index.SwitchField, {
-    "aria-label": "line-chart switch-field"
-  }))));
-  return (0, _react2.jsx)(_react["default"].Fragment, null, EmptyData, FullData, PartialData, ZeroData, ZeroValues);
-};
-exports.Default = Default;