react-jupiter 5.12.0 → 6.0.0-beta.1

package/dist/components/card/event-card/index.test.js

@@ -0,0 +1,79 @@
+"use strict";var _react = _interopRequireDefault(require("react"));
+var _enzyme = require("enzyme");
+var _reactRouterDom = require("react-router-dom");
+var _index = _interopRequireDefault(require("./index"));
+var _constants = require("./constants");
+var _test = _interopRequireDefault(require("../../utils/test"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}function _extends() {return _extends = Object.assign ? Object.assign.bind() : function (n) {for (var e = 1; e < arguments.length; e++) {var t = arguments[e];for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);}return n;}, _extends.apply(null, arguments);}
+
+const setupMount = function () {let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};return (
+    (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_index.default, _extends({ level: props.level }, props)))));};
+
+
+describe('Event Card', () => {
+  it('should render default vertical event card', () => {
+    const VerticalCard = setupMount({
+      type: _constants.VERTICAL_CARD,
+      title: 'تایتل یک رویداد نسبتا طولانی در اینجاست که قرار است اضافه بیاید و بزند به بیرون',
+      cover: 'https://static.evand.net/images/events/covers/original/2e6f40ac8e1bc78304ccf3fd77b1b3d5.jpg',
+      date: '2020-01-10T14:00:00+0330',
+      place: 'تهران',
+      price: 'از ۴۴۰۰۰ تومان',
+      organization: {
+        logo: 'https://static.evand.net/images/organizations/logos/original/e90483ade453446ae2fd156e15244d04.jpg',
+        name: 'هلدینگ کلان - مجتمع فنی پلی تکنیک - شرکت تجارت جهانی اندیشه'
+      },
+      onClickBookmark: () => {window.console.log('handle click bookmark');},
+      renderEventLink: (element) => /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, { to: "/tosomewherenew" }, element),
+      renderOrganizationLink: (element) => /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, { to: "/tosomewherenew" }, element)
+    });
+    const VerticalCover = (0, _test.default)(VerticalCard.find('img'), 'vertical-cover');
+    const VerticalContent = (0, _test.default)(VerticalCard.find('div'), 'vertical-content');
+    expect(VerticalCover.length).toBe(1);
+    expect(VerticalContent.length).toBe(1);
+    VerticalCard.unmount();
+  });
+
+  it('should render horizontal event card', () => {
+    const HorizontalCard = setupMount({
+      type: _constants.HORIZONTAL_CARD,
+      title: 'نام رویداد مورد نظر',
+      price: 'از ۲۰۰۰۰۰ تومان',
+      location: 'تهران',
+      date: '2020-01-10T14:00:00+0330',
+      cover: 'https://static.evand.net/images/events/covers/original/2e6f40ac8e1bc78304ccf3fd77b1b3d5.jpg',
+      renderEventLink: (element) => /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, { to: "/tosomewherenew" }, element)
+    });
+    const HorizontalCover = (0, _test.default)(HorizontalCard.find('img'), 'horizontal-cover');
+    const HorizontalContent = (0, _test.default)(HorizontalCard.find('div'), 'horizontal-content');
+    expect(HorizontalCover.length).toBe(1);
+    expect(HorizontalContent.length).toBe(1);
+    HorizontalCard.unmount();
+  });
+
+  it('should act correctly on clicking on bookmark icon', () => {
+    const fn = jest.fn();
+    const VerticalCard = setupMount({
+      type: _constants.VERTICAL_CARD,
+      title: 'تایتل یک رویداد نسبتا طولانی در اینجاست که قرار است اضافه بیاید و بزند به بیرون',
+      cover: 'https://static.evand.net/images/events/covers/original/2e6f40ac8e1bc78304ccf3fd77b1b3d5.jpg',
+      date: '2020-01-10T14:00:00+0330',
+      place: 'تهران',
+      price: 'از ۴۴۰۰۰ تومان',
+      onClickBookmark: fn,
+      organization: {
+        logo: 'https://static.evand.net/images/organizations/logos/original/e90483ade453446ae2fd156e15244d04.jpg',
+        name: 'هلدینگ کلان - مجتمع فنی پلی تکنیک - شرکت تجارت جهانی اندیشه'
+      },
+      renderEventLink: (element) => /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, { to: "/tosomewherenew" }, element),
+      renderOrganizationLink: (element) => /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, { to: "/tosomewherenew" }, element)
+    });
+    const Bookmark = (0, _test.default)(VerticalCard, 'vertical-date-bookmark').find('i[name="bookmark-border"]');
+    expect(Bookmark.length).toBe(1);
+    Bookmark.simulate('click');
+    const NewBookmark = (0, _test.default)(VerticalCard, 'vertical-date-bookmark').find('i[name="bookmark-border"]');
+    expect(NewBookmark.length).toBe(0);
+    const Bookmarked = (0, _test.default)(VerticalCard, 'vertical-date-bookmark').find('i[name="bookmark"]');
+    expect(Bookmarked.length).toBe(1);
+    VerticalCard.unmount();
+  });
+});

package/dist/components/card/index.js

@@ -0,0 +1,16 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });Object.defineProperty(exports, "CardTemplate", { enumerable: true, get: function () {return _cardTemplate.default;} });Object.defineProperty(exports, "EventCard", { enumerable: true, get: function () {return _eventCard.default;} });Object.defineProperty(exports, "OrganizerCard", { enumerable: true, get: function () {return _organizationCard.default;} });Object.defineProperty(exports, "OrgnizerCard", { enumerable: true, get: function () {return _orgnizerCard.default;} });exports.default = void 0;var _cardTemplate = _interopRequireDefault(require("./card-template"));
+var _eventCard = _interopRequireDefault(require("./event-card"));
+var _organizationCard = _interopRequireDefault(require("./organization-card"));
+var _orgnizerCard = _interopRequireDefault(require("./orgnizer-card"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}var _default = exports.default =
+
+
+
+
+
+
+{
+  CardTemplate: _cardTemplate.default,
+  EventCard: _eventCard.default,
+  OrganizerCard: _organizationCard.default,
+  OrgnizerCard: _orgnizerCard.default
+};

package/dist/components/card/organization-card/index.js

@@ -0,0 +1,59 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+var _titledAvatar = _interopRequireDefault(require("../../titled-avatar"));
+var _numericSummeryReport = _interopRequireDefault(require("../../numeric-summery-report"));
+var _button = _interopRequireDefault(require("../../button"));
+var _index = _interopRequireDefault(require("./index.style"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const OrganizationCard = (props) => {
+  const {
+    title, logo, followed = false, report, onClickFollow, renderLink
+  } = props;
+
+  const reportData = [
+  { id: 1, title: 'برگزار شده', count: report.heldEventsNumber },
+  { id: 2, title: 'فعال', count: report.activeEventsNumber },
+  { id: 3, title: 'دنبال‌کننده‌ها', count: report.followingNumber }];
+
+
+  return (/*#__PURE__*/
+    _react.default.createElement(_index.default, {
+      direction: "vertical",
+      hoverToLevel: 3,
+      maxWidth: 370,
+      "data-test": "organization-card" }, /*#__PURE__*/
+
+    _react.default.createElement(_titledAvatar.default, {
+      title: title,
+      avatar: logo,
+      renderAvatarLink: renderLink }
+    ), /*#__PURE__*/
+    _react.default.createElement(_numericSummeryReport.default, { data: reportData }), /*#__PURE__*/
+    _react.default.createElement(_button.default, {
+      styleType: followed ? 'secondary' : 'primary',
+      onClick: onClickFollow,
+      mainColor: "blue",
+      size: "sm",
+      wide: true },
+
+    followed ? 'دنبال نکنید' : 'دنبال کنید'
+    )
+    ));
+
+};var _default = exports.default =
+
+OrganizationCard;

package/dist/components/card/organization-card/index.stories.js

@@ -0,0 +1,49 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = exports.Default = void 0;var _react = _interopRequireDefault(require("react"));
+var _index = _interopRequireDefault(require("./index"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}var _default = exports.default =
+
+{
+  title: 'Components/OrganizationCard',
+  component: _index.default,
+  argTypes: {
+    name: {
+      control: 'text',
+      description: 'The organization name'
+    },
+    logo: {
+      control: 'text',
+      description: 'The organization logo URL'
+    },
+    cover: {
+      control: 'text',
+      description: 'The organization cover image URL'
+    },
+    renderLink: {
+      control: 'function',
+      description: 'Function to render a link wrapper'
+    },
+    report: {
+      control: 'object',
+      description: 'The organization statistics'
+    },
+    onClickFollow: {
+      action: 'clicked',
+      description: 'Callback when follow button is clicked'
+    }
+  }
+};
+
+const Template = (args) => /*#__PURE__*/_react.default.createElement(_index.default, args);
+
+const Default = exports.Default = Template.bind({});
+Default.args = {
+  name: 'Organization Name',
+  logo: 'https://via.placeholder.com/80',
+  cover: 'https://via.placeholder.com/300x100',
+  renderLink: (el) => /*#__PURE__*/_react.default.createElement("a", { href: "/org-profile" }, el),
+  report: {
+    heldEventsNumber: 2,
+    activeEventsNumber: 17,
+    followingNumber: 148
+  },
+  onClickFollow: () => {window.console.log('click on follow');}
+};

package/dist/components/card/organization-card/index.style.js

@@ -0,0 +1,10 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = void 0;var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _cardTemplate = _interopRequireDefault(require("../card-template"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}
+
+const Container = (0, _styledComponents.default)(_cardTemplate.default)`
+  padding: 16px; 
+  height: 200px;
+  justify-content: space-between;
+`;var _default = exports.default =
+
+Container;

package/dist/components/card/organization-card/index.test.js

@@ -0,0 +1,25 @@
+"use strict";var _react = _interopRequireDefault(require("react"));
+var _enzyme = require("enzyme");
+var _test = _interopRequireDefault(require("../../utils/test"));
+var _index = _interopRequireDefault(require("./index"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}function _extends() {return _extends = Object.assign ? Object.assign.bind() : function (n) {for (var e = 1; e < arguments.length; e++) {var t = arguments[e];for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);}return n;}, _extends.apply(null, arguments);}
+
+const setupShallow = function () {let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};return (
+    (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_index.default, _extends({ data: props.data }, props))));};
+
+
+describe('should render correctly', () => {
+  it('should render correctly', () => {
+    const component = setupShallow({
+      title: 'انجمن علمی کامپیوتر دانشگاه صنعتی خواجه',
+      logo: 'https://static.evand.net/images/organizations/logos/original/d431e339d86b187f356055f1d6f39ddb.jpg?x-oss-process=image/resize,h_250',
+      report: {
+        heldEventsNumber: 2,
+        activeEventsNumber: 17,
+        followingNumber: 148
+      },
+      onClickFollow: () => {window.console.log('handle click follow');}
+    });
+    const OrganizationCard = (0, _test.default)(component, 'organization-card');
+    expect(OrganizationCard.length).toBe(1);
+  });
+});

package/dist/components/card/orgnizer-card/buttons.js

@@ -0,0 +1,48 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = void 0;var _react = _interopRequireDefault(require("react"));
+var _button = _interopRequireDefault(require("../../button"));
+var _index = require("./index.style");function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}
+
+
+
+
+
+
+
+
+
+const Buttons = (props) => {
+  const {
+    onClickFollowMe,
+    onClickConnectUs,
+    isFollowed
+  } = props;
+
+  return (/*#__PURE__*/
+    _react.default.createElement(_index.LTRContainer, null, /*#__PURE__*/
+    _react.default.createElement(_button.default, {
+      className: "follow-button",
+      styleType: "primary",
+      mainColor: "blue",
+      htmlType: "button",
+      size: "sm",
+      width: "100px",
+      onClick: onClickFollowMe,
+      style: { marginLeft: '12px' } },
+
+    isFollowed ? 'دنبال میکنید' : 'دنبال کنید'
+    ), /*#__PURE__*/
+    _react.default.createElement(_button.default, {
+      styleType: "secondary",
+      htmlType: "button",
+      mainColor: "blue",
+      width: "100px",
+      size: "sm",
+      onClick: onClickConnectUs },
+    "\u062A\u0645\u0627\u0633"
+
+    )
+    ));
+
+};var _default = exports.default =
+
+Buttons;

package/dist/components/card/orgnizer-card/index.js

@@ -0,0 +1,179 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = void 0;var _react = _interopRequireDefault(require("react"));
+var _typography = require("../../typography");
+var _buttons = _interopRequireDefault(require("./buttons"));
+var _index = require("./index.style");
+
+
+
+
+var _display = _interopRequireDefault(require("../../display"));
+var _icon = _interopRequireDefault(require("../../icon"));
+var _avatar = _interopRequireDefault(require("../../avatar"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const OrgnizerCard = (props) => {
+  const {
+    name,
+    logo,
+    renderOrganizerLink,
+    partnership,
+    isFollowed = false,
+    onClickFollowMe = () => false,
+    onClickConnectUs = () => {},
+    allEventsCount = null,
+    activeEventsCount = null,
+    recommendedCount = null,
+    description = null,
+    followersCount = ''
+  } = props;
+
+  return (/*#__PURE__*/
+    _react.default.createElement(_index.Container, { className: "organizer-card" }, /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", flexDirection: "row", flexDirectionMobile: "column", alignItems: "start", justifyContent: "space-between" }, /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", flexDirection: "row", flexDirectionMobile: "column", justifyContent: "start", width: "100%", flex: "4 1" }, /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", flex: "1 1", className: "avatar" },
+    renderOrganizerLink(/*#__PURE__*/_react.default.createElement(_avatar.default, {
+      alt: name,
+      src: logo,
+      size: "md",
+      sizeMobile: "lg",
+      round: true,
+      width: 64,
+      height: 64 }
+    ))
+    ), /*#__PURE__*/
+    _react.default.createElement("div", { className: "mr" }, /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", alignItems: "baseline" },
+    renderOrganizerLink(/*#__PURE__*/
+      _react.default.createElement(_typography.Text, { size: 14, textAlign: "right", bold: true }, "\u0628\u0631\u06AF\u0632\u0627\u0631\u200C\u06A9\u0646\u0646\u062F\u0647:",
+
+      ' ',
+      name
+      )
+    )
+    ),
+    !!partnership && /*#__PURE__*/
+
+    _react.default.createElement(_index.PartnershipBox, null, /*#__PURE__*/
+    _react.default.createElement(_icon.default, {
+      name: partnership,
+      color: "yellow",
+      stickyRight: true }
+    ), /*#__PURE__*/
+    _react.default.createElement("span", null,
+    partnership === 'partner' ? 'همیار' : 'همکار',
+    ' ', "\u0627\u06CC\u0648\u0646\u062F"
+
+    )
+    ),
+
+    description && /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex" }, /*#__PURE__*/
+    _react.default.createElement(_typography.Paragraph, { size: 12, color: "riverBed" },
+    description.slice(0, 350).concat('...')
+    )
+    ),
+
+    !!recommendedCount && /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: "14", bold: true, color: "riverBed", className: "recommend" },
+    ` ${recommendedCount} `, "\u0627\u06CC\u0646 \u0628\u0631\u06AF\u0632\u0627\u0631\u06A9\u0646\u0646\u062F\u0647 \u0631\u0627 \u062A\u0648\u0635\u06CC\u0647 \u06A9\u0631\u062F\u0647\u200C\u0627\u0646\u062F."
+
+    )
+
+    )
+    ), /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", alignItems: "start", flexDirection: "column", justifyContent: "space-between", width: "100%", flex: "2 1", alignSelf: "stretch" }, /*#__PURE__*/
+    _react.default.createElement(_display.default, { className: "statistics", display: "flex", alignItems: "start", flexDirection: "row", justifyContent: "space-evenly", width: "100%" },
+    followersCount && /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "block" }, /*#__PURE__*/
+    _react.default.createElement(_index.TextCenter, null, /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 16, bold: true },
+    followersCount
+    ), /*#__PURE__*/
+    _react.default.createElement("br", null), /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 12, bold: true }, "\u062F\u0646\u0628\u0627\u0644 \u06A9\u0646\u0646\u062F\u0647"
+
+    )
+    )
+    ),
+
+    allEventsCount && /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "block" }, /*#__PURE__*/
+    _react.default.createElement(_index.TextCenter, null, /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 16, bold: true },
+    allEventsCount
+    ), /*#__PURE__*/
+    _react.default.createElement("br", null), /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 12, bold: true }, "\u06A9\u0644 \u0631\u0648\u06CC\u062F\u0627\u062F\u0647\u0627"
+
+    )
+    )
+    ),
+
+    activeEventsCount && /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "block" }, /*#__PURE__*/
+    _react.default.createElement(_index.TextCenter, null, /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 16, bold: true },
+    activeEventsCount
+    ), /*#__PURE__*/
+    _react.default.createElement("br", null), /*#__PURE__*/
+    _react.default.createElement(_typography.Text, { size: 12, bold: true }, "\u0631\u0648\u06CC\u062F\u0627\u062F \u0641\u0639\u0627\u0644"
+
+    )
+    )
+    )
+
+    ), /*#__PURE__*/
+    _react.default.createElement(_display.default, { display: "flex", flexDirection: "row", flexDirectionMobile: "column", alignItems: "center", justifyContent: "space-between", width: "100%" }, /*#__PURE__*/
+    _react.default.createElement(_buttons.default, {
+      onClickFollowMe: onClickFollowMe,
+      onClickConnectUs: onClickConnectUs,
+      isFollowed: isFollowed }
+    )
+    )
+    )
+    ), /*#__PURE__*/
+    _react.default.createElement("style", null,
+    `
+          .recommend {
+            display: block;
+            margin: 10px 0;
+          }
+          @media (max-width: 768px) {
+            .avatar {
+              margin: 5px auto 10px;
+            }
+            .statistics {
+              margin: 25px auto;
+            }
+          }
+          @media (min-width: 768px) {
+            .mr {
+              display: flex;
+              flex-direction: column;
+              flex: 5 1;
+              min-height: 123px;
+              justify-content: space-between;
+            }
+          }
+        `
+    )
+    ));
+
+};var _default = exports.default =
+
+OrgnizerCard;

package/dist/components/card/orgnizer-card/index.stories.js

@@ -0,0 +1,81 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.default = exports.Sponsor = exports.Partner = exports.Followed = exports.Default = void 0;var _react = _interopRequireDefault(require("react"));
+
+var _index = _interopRequireDefault(require("./index"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}function _extends() {return _extends = Object.assign ? Object.assign.bind() : function (n) {for (var e = 1; e < arguments.length; e++) {var t = arguments[e];for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);}return n;}, _extends.apply(null, arguments);}var _default = exports.default =
+
+{
+  title: 'OrganizerCard',
+  component: _index.default,
+
+  argTypes: {
+    name: {
+      control: 'text',
+      defaultValue: 'وزارت آموزش و پرورش'
+    },
+    followersCount: {
+      control: 'text',
+      defaultValue: '۱۳۲۴۷'
+    },
+    logo: {
+      control: 'text',
+      defaultValue: 'https://i.pravatar.cc/300?img=13'
+    },
+    activeEventsCount: {
+      control: 'text',
+      defaultValue: '۱۲۳'
+    },
+    allEventsCount: {
+      control: 'text',
+      defaultValue: '۲۴۵۶۷'
+    },
+    recommendedCount: {
+      control: 'text',
+      defaultValue: '۳۳ نفر'
+    },
+    isFollowed: {
+      control: 'boolean',
+      defaultValue: false
+    },
+    partnership: {
+      control: 'select',
+      options: ['colleague', 'partner', 'sponsor'],
+      defaultValue: 'colleague'
+    }
+  }
+};
+
+const Template = (args) => /*#__PURE__*/
+_react.default.createElement(_index.default, _extends({},
+args, {
+  renderOrganizerLink: (el) => /*#__PURE__*/_react.default.createElement("a", { href: "https://i.pravatar.cc/300?img=1" }, el) })
+);
+
+
+const Default = exports.Default = Template.bind({});
+Default.args = {
+  name: 'وزارت آموزش و پرورش',
+  followersCount: '۱۳۲۴۷',
+  logo: 'https://i.pravatar.cc/300?img=13',
+  activeEventsCount: '۱۲۳',
+  allEventsCount: '۲۴۵۶۷',
+  recommendedCount: '۳۳ نفر',
+  isFollowed: false,
+  partnership: 'colleague'
+};
+
+const Partner = exports.Partner = Template.bind({});
+Partner.args = {
+  ...Default.args,
+  partnership: 'partner'
+};
+
+const Sponsor = exports.Sponsor = Template.bind({});
+Sponsor.args = {
+  ...Default.args,
+  partnership: 'sponsor'
+};
+
+const Followed = exports.Followed = Template.bind({});
+Followed.args = {
+  ...Default.args,
+  isFollowed: true
+};

package/dist/components/card/orgnizer-card/index.style.js

@@ -0,0 +1,58 @@
+"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.TextCenter = exports.StyledButton = exports.ResponsiveFlex = exports.PartnershipBox = exports.LTRContainer = exports.Container = exports.BorderedBox = void 0;var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _cardTemplate = _interopRequireDefault(require("../card-template"));
+var _button = _interopRequireDefault(require("../../button"));
+var _themes = _interopRequireDefault(require("../../themes"));function _interopRequireDefault(e) {return e && e.__esModule ? e : { default: e };}
+
+const Container = exports.Container = (0, _styledComponents.default)(_cardTemplate.default)`
+  padding: 16px;
+`;
+
+const LTRContainer = exports.LTRContainer = _styledComponents.default.div`
+  display: flex;
+`;
+
+const StyledButton = exports.StyledButton = (0, _styledComponents.default)(_button.default)`
+  margin: 4px 8px;
+  direction: rtl;
+  min-width: 120px;
+
+  &.follow-button {
+  }
+`;
+
+const BorderedBox = exports.BorderedBox = _styledComponents.default.div`
+  border: ${(_ref) => {let { theme } = _ref;return theme.border.lightBlue;}};
+  padding: 8px 16px;
+  margin: 8px 8px 0 8px;
+  display: flex;
+  justify-content: space-between;
+`;
+
+const TextCenter = exports.TextCenter = _styledComponents.default.div`
+  text-align: center;
+`;
+
+const ResponsiveFlex = exports.ResponsiveFlex = _styledComponents.default.div`
+  display: flex;
+  @media only screen and (max-width: ${_themes.default.breakpoints.sm}px) {
+    flex-flow: column nowrap;
+  }
+  @media only screen and (min-width: ${_themes.default.breakpoints.sm}px) {
+    flex-flow: row nowrap;
+  }
+  align-items: center;
+  justify-content: space-between;
+`;
+
+const PartnershipBox = exports.PartnershipBox = _styledComponents.default.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: rgba(255, 199, 39, 0.1);
+  border-radius: 5px;
+  color: #FFD324;
+  margin-top: 10px;
+  align-items: center;
+  width: 110px;
+  height: 25px;
+`;