@helpscout/hsds-react/components/ArticleCard/ArticleCard.storiesHelpers.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.metaHeader = metaHeader;
exports.footer = footer;

var _react = _interopRequireDefault(require("react"));

var _index = require("../index");

var _avatarList = _interopRequireDefault(require("../../utilities/specs/avatarList.specs"));

var _jsxRuntime = require("react/jsx-runtime");

function metaHeader() {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flexy, {
    align: "top",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Flexy.Block, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
        faint: true,
        size: "12",
        children: "Last updated 1 day ago"
      })
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Flexy.Item, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.StatusBadge, {
        count: 20,
        status: 'new'
      })
    })]
  });
}

function footer() {
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.AvatarList, {
    max: 5,
    size: "sm",
    stack: true,
    children: _avatarList.default.generate(5).map(function (avatar) {
      var name = avatar.name,
          image = avatar.image;
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Avatar, {
        image: image,
        name: name,
        status: null
      }, name);
    })
  });
}