design-system-govbr-rnp/dist/components/Card/Card.stories.js

## Padrão Digital de Governo - React Biblioteca de componentes React que implementa o [Padrão Visual digital do governo](https://www.gov.br/ds/). O objetivo da biblioteca é facilitar a implementação e promover a padronização das interfaces de sistemas do

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Simple = exports.Hover = exports.FixedHeight = exports.Disabled = exports.Details = exports.Default = void 0;
var _react = _interopRequireDefault(require("react"));
var _storybookAddonState = _interopRequireDefault(require("storybook-addon-state"));
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
var _Button = _interopRequireDefault(require("../Button/Button"));
var _Card = _interopRequireDefault(require("./Card"));
var _CardActions = _interopRequireDefault(require("./CardActions"));
var _CardContent = _interopRequireDefault(require("./CardContent"));
var _CardHeader = _interopRequireDefault(require("./CardHeader"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var _default = {
  title: "Components/Card",
  component: _Card.default
};
exports.default = _default;
var Template = function Template(args) {
  return /*#__PURE__*/_react.default.createElement(_Card.default, args, /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
    avatar: /*#__PURE__*/_react.default.createElement(_Avatar.default, {
      size: "small",
      src: "https://picsum.photos/id/823/400",
      title: "Avatar Fotogr\xE1fico",
      type: "fotographic"
    }),
    actions: /*#__PURE__*/_react.default.createElement(_Button.default, {
      circle: true,
      density: "small",
      iconProps: {
        ariaLabel: "More button",
        icon: _freeSolidSvgIcons.faEllipsisV
      },
      onClick: function onClick() {},
      variant: "terciary",
      disabled: args.disabled
    }),
    title: "Maria Amorin",
    subHeader: "UX Designer"
  }), /*#__PURE__*/_react.default.createElement(_CardContent.default, {
    height: args.height
  }, args.children), /*#__PURE__*/_react.default.createElement(_CardActions.default, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
    title: "share",
    density: "small",
    onClick: function onClick() {},
    variant: "terciary",
    disabled: args.disabled
  })));
};
var TemplateExpanded = function TemplateExpanded(args) {
  var _useState = (0, _storybookAddonState.default)(false),
    _useState2 = _slicedToArray(_useState, 2),
    isOpen = _useState2[0],
    setIsOpen = _useState2[1];
  return /*#__PURE__*/_react.default.createElement(_Card.default, args, /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
    avatar: /*#__PURE__*/_react.default.createElement(_Avatar.default, {
      size: "small",
      src: "https://picsum.photos/id/823/400",
      title: "Avatar Fotogr\xE1fico",
      type: "fotographic"
    }),
    actions: /*#__PURE__*/_react.default.createElement(_Button.default, {
      circle: true,
      density: "small",
      iconProps: {
        ariaLabel: "More button",
        icon: _freeSolidSvgIcons.faEllipsisV
      },
      onClick: function onClick() {},
      variant: "terciary",
      disabled: args.disabled
    }),
    title: "Maria Amorin",
    subHeader: "UX Designer"
  }), /*#__PURE__*/_react.default.createElement(_CardContent.default, {
    height: args.height
  }, args.children), /*#__PURE__*/_react.default.createElement(_CardActions.default, null, /*#__PURE__*/_react.default.createElement("div", {
    style: {
      marginLeft: "auto"
    }
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
    circle: true,
    density: "small",
    iconProps: {
      ariaLabel: "Expanded",
      icon: _freeSolidSvgIcons.faEllipsisV
    },
    onClick: function onClick() {
      return setIsOpen(!isOpen);
    },
    variant: "terciary",
    disabled: args.disabled
  }))), isOpen && /*#__PURE__*/_react.default.createElement(_CardContent.default, null, args.children));
};
var Default = Template.bind({});
exports.Default = Default;
Default.storyName = "Card completo";
Default.args = {
  children: "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit. ",
  width: 300
};
var Simple = function Simple() {
  return /*#__PURE__*/_react.default.createElement(_Card.default, {
    width: 300
  }, /*#__PURE__*/_react.default.createElement(_CardContent.default, null, /*#__PURE__*/_react.default.createElement("img", {
    src: "https://picsum.photos/id/0/500",
    alt: "Imagem simples",
    style: {
      width: "100%"
    }
  })));
};
exports.Simple = Simple;
Simple.storyName = "Card simples";
var Disabled = Template.bind({});
exports.Disabled = Disabled;
Disabled.storyName = "Card desativado";
Disabled.args = {
  children: "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit. ",
  disabled: true,
  width: 300
};
var Hover = Template.bind({});
exports.Hover = Hover;
Hover.storyName = "Card com hover";
Hover.args = {
  children: "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit. ",
  hover: true,
  width: 300
};
var FixedHeight = Template.bind({});
exports.FixedHeight = FixedHeight;
FixedHeight.storyName = "Card com altura fixa";
FixedHeight.args = {
  children: "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!",
  height: 300,
  width: 300
};
var Details = TemplateExpanded.bind({});
exports.Details = Details;
Details.storyName = "Card expansivo";
Details.args = {
  children: "Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eligendi\n  voluptatem modi libero non officiis doloremque itaque reiciendis? Ipsam\n  optio deleniti hic, earum recusandae qui? Consequuntur impedit repellendus\n  ipsum quam doloribus!Lorem, ipsum dolor sit amet consectetur adipisicing elit.",
  width: 300
};