@storybook/design-system/dist/components/marketing/PageFooter/PageFooter.js

Storybook design system

"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.PageFooter = void 0;

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

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

var _Link = require("../../Link");

var _Resource = require("./Resource");

var _CommunityLink = require("./CommunityLink");

var _Service = require("./Service");

var _PageFooter = require("./PageFooter.styles");

var _coloredIcons = require("../../../images/colored-icons");

var _logos = require("../../../images/logos");

var _excluded = ["navLinks", "storybookLogoLink", "subscribeForm", "tutorialsLink"];
var coreFrameworks = ['react', 'vue', 'angular', 'web-components'];

var PageFooter = function PageFooter(_ref) {
  var navLinks = _ref.navLinks,
      storybookLogoLink = _ref.storybookLogoLink,
      subscribeForm = _ref.subscribeForm,
      tutorialsLink = _ref.tutorialsLink,
      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  return /*#__PURE__*/_react["default"].createElement(_PageFooter.FooterWrapper, props, /*#__PURE__*/_react["default"].createElement(_PageFooter.Upper, null, /*#__PURE__*/_react["default"].createElement(_PageFooter.UpperColumn, null, /*#__PURE__*/_react["default"].createElement(_Resource.Resource, {
    image: /*#__PURE__*/_react["default"].createElement(_coloredIcons.Repo, {
      title: "Docs"
    }),
    title: "Documentation",
    description: "Add Storybook to your project in less than a minute to build components faster and easier.",
    links: coreFrameworks.map(function (framework) {
      return /*#__PURE__*/_react["default"].createElement(_PageFooter.ResourceAction, {
        withArrow: true,
        key: framework,
        href: "/docs/".concat(framework, "/get-started/introduction")
      }, framework);
    })
  })), /*#__PURE__*/_react["default"].createElement(_PageFooter.UpperColumn, null, /*#__PURE__*/_react["default"].createElement(_Resource.Resource, {
    image: /*#__PURE__*/_react["default"].createElement(_coloredIcons.Direction, {
      title: "Tutorial"
    }),
    title: "Tutorials",
    description: "Learn Storybook with in-depth tutorials that teaches Storybook best practices. Follow along with code samples.",
    links: /*#__PURE__*/_react["default"].createElement(_Link.Link, {
      withArrow: true,
      href: tutorialsLink
    }, "Learn Storybook now")
  }))), /*#__PURE__*/_react["default"].createElement(_PageFooter.Lower, null, /*#__PURE__*/_react["default"].createElement(_PageFooter.Colophon, null, storybookLogoLink, /*#__PURE__*/_react["default"].createElement(_PageFooter.Text, null, "The MIT License (MIT). Website design by", ' ', /*#__PURE__*/_react["default"].createElement(_Link.Link, {
    tertiary: true,
    href: "https://twitter.com/domyen",
    target: "_blank"
  }, /*#__PURE__*/_react["default"].createElement("b", null, "@domyen")), ' ', "and the awesome Storybook community.")), /*#__PURE__*/_react["default"].createElement(_PageFooter.Column, null, /*#__PURE__*/_react["default"].createElement(_PageFooter.Title, null, "Storybook"), navLinks), /*#__PURE__*/_react["default"].createElement(_PageFooter.Column, null, /*#__PURE__*/_react["default"].createElement(_PageFooter.Title, null, "Community"), /*#__PURE__*/_react["default"].createElement(_CommunityLink.CommunityLink, {
    href: "https://github.com/storybookjs/storybook",
    icon: "github",
    name: "GitHub"
  }), /*#__PURE__*/_react["default"].createElement(_CommunityLink.CommunityLink, {
    href: "https://twitter.com/storybookjs",
    icon: "twitter",
    name: "Twitter"
  }), /*#__PURE__*/_react["default"].createElement(_CommunityLink.CommunityLink, {
    href: "https://discord.com/invite/storybook",
    icon: "discord",
    name: "Discord"
  }), /*#__PURE__*/_react["default"].createElement(_CommunityLink.CommunityLink, {
    href: "https://www.youtube.com/channel/UCr7Quur3eIyA_oe8FNYexfg",
    icon: "youtube",
    name: "Youtube"
  }), /*#__PURE__*/_react["default"].createElement(_CommunityLink.CommunityLink, {
    href: "https://componentdriven.org/",
    icon: "componentdriven",
    name: "Component Driven UIs"
  })), subscribeForm && /*#__PURE__*/_react["default"].createElement(_PageFooter.Subscribe, null, /*#__PURE__*/_react["default"].createElement(_PageFooter.Title, null, "Subscribe"), /*#__PURE__*/_react["default"].createElement(_PageFooter.Text, null, "Get news, free tutorials, and Storybook tips emailed to you."), subscribeForm)), /*#__PURE__*/_react["default"].createElement(_PageFooter.HrWrapper, null, /*#__PURE__*/_react["default"].createElement("hr", null)), /*#__PURE__*/_react["default"].createElement(_PageFooter.Services, null, /*#__PURE__*/_react["default"].createElement(_Service.Service, {
    text: "Maintained by",
    href: "https://www.chromatic.com/",
    logo: /*#__PURE__*/_react["default"].createElement(_logos.Chromatic, {
      title: "Chromatic"
    })
  }), /*#__PURE__*/_react["default"].createElement(_Service.Service, {
    text: "Continuous integration by",
    href: "https://circleci.com/",
    logo: /*#__PURE__*/_react["default"].createElement(_logos.Circleci, {
      title: "CircleCI"
    }),
    muteLogo: true
  }), /*#__PURE__*/_react["default"].createElement(_Service.Service, {
    text: "Hosting by",
    href: "https://netlify.com",
    logo: /*#__PURE__*/_react["default"].createElement(_logos.Netlify, {
      title: "Netlify"
    })
  })));
};

exports.PageFooter = PageFooter;