@quintype/arrow 3.15.1-perf.1 → 3.15.1-perf.10

package/entry-points.js

@@ -0,0 +1,359 @@
+// /**
+//  * #### IMPORTANT NOTE ####
+//  * - be careful while changing the 'name' of a component
+//  * - rollup uses this name to create the folder in which the CSS file for that component is placed
+//  * - so if you change the name, it basically will change Arrow's API
+//  * Example:
+//  * - if you change {name: "Text"} to {name: "Text123"},
+//  * - arrow users will have to change `import "@quintype/arrow/Text/styles.arrow.css"` to `import "@quintype/arrow/Text123/styles.arrow.css"` everywhere.
+//  * ----x----x----x----x----
+//  *
+//  * Every component that arrow exports should export its CSS separately
+//  * Entries here have to match with components exported in src/index.js
+//  *
+//  */
+// const path = require("path");
+// function getEntryPoints() {
+//   return {
+//     main: path.resolve(path.join(__dirname, "/index.js")),
+//     allRows: path.resolve(path.join(__dirname, "/rows.js")),
+//     atoms: format(atomsEntryPoints()),
+//     "story-elements": format(storyElementsEntryPoints()),
+//     molecules: format(moleculesEntryPoints()),
+//     rows: format(rowsEntryPoints()),
+//     "story-templates": format(storyTemplateEntryPoints())
+//   };
+// }
+// function format(entryPtsArr) {
+//   return entryPtsArr.reduce((accumulator, currentBundle) => {
+//     accumulator[currentBundle.name] = currentBundle.path;
+//     return accumulator;
+//   }, {});
+// }
+// function storyElementsEntryPoints() {
+//   const basePath = path.resolve(path.join(__dirname, "/components/Atoms/StoryElements"));
+//   return [
+//     {
+//       name: "Text",
+//       path: `${basePath}/Text/index.js`
+//     },
+//     {
+//       name: "Quote",
+//       path: `${basePath}/Quote/index.js`
+//     },
+//     {
+//       name: "Blurb",
+//       path: `${basePath}/Blurb/index.js`
+//     },
+//     {
+//       name: "AlsoRead",
+//       path: `${basePath}/AlsoRead/index.js`
+//     },
+//     {
+//       name: "Summary",
+//       path: `${basePath}/Summary/index.js`
+//     },
+//     {
+//       name: "BlockQuote",
+//       path: `${basePath}/BlockQuote/index.js`
+//     },
+//     {
+//       name: "Image",
+//       path: `${basePath}/Image/index.js`
+//     },
+//     {
+//       name: "Video",
+//       path: `${basePath}/Video/index.js`
+//     },
+//     {
+//       name: "BigFact",
+//       path: `${basePath}/BigFact/index.js`
+//     },
+//     {
+//       name: "StoryElement",
+//       path: `${basePath}/StoryElement/index.js`
+//     },
+//     {
+//       name: "QuestionAnswer",
+//       path: `${basePath}/QuestionAnswer/index.js`
+//     },
+//     {
+//       name: "ImageGallery",
+//       path: `${basePath}/imageGallery/index.js`
+//     },
+//     {
+//       name: "Reference",
+//       path: `${basePath}/Reference/index.js`
+//     },
+//     {
+//       name: "Attachment",
+//       path: `${basePath}/Attachment/index.js`
+//     },
+//     {
+//       name: "ImageSlideshow",
+//       path: `${basePath}/ImageSlideshow/index.js`
+//     }
+//   ];
+// }
+// function atomsEntryPoints() {
+//   const basePath = path.resolve(path.join(__dirname, "/components/Atoms"));
+//   return [
+//     {
+//       name: "Author",
+//       path: `${basePath}/Author/index.js`
+//     },
+//     {
+//       name: "AuthorWithTime",
+//       path: `${basePath}/AuthorWithTimestamp/index.js`
+//     },
+//     {
+//       name: "CollectionName",
+//       path: `${basePath}/CollectionName/index.js`
+//     },
+//     {
+//       name: "Headline",
+//       path: `${basePath}/Headline/index.js`
+//     },
+//     {
+//       name: "HeroImage",
+//       path: `${basePath}/HeroImage/index.js`
+//     },
+//     {
+//       name: "LoadmoreButton",
+//       path: `${basePath}/Loadmore/index.js`
+//     },
+//     {
+//       name: "SectionTag",
+//       path: `${basePath}/SectionTag/index.js`
+//     },
+//     {
+//       name: "Subheadline",
+//       path: `${basePath}/Subheadline/index.js`
+//     },
+//     {
+//       name: "TimeStamp",
+//       path: `${basePath}/TimeStamp/index.js`
+//     },
+//     {
+//       name: "ScrollSnap",
+//       path: `${basePath}/ScrollSnap/index.js`
+//     },
+//     {
+//       name: "ExtendedLoadMore",
+//       path: `${basePath}/ExtendedLoadMore/index.js`
+//     }
+//   ];
+// }
+// function moleculesEntryPoints() {
+//   const basePath = path.resolve(path.join(__dirname, "/components/Molecules"));
+//   return [
+//     {
+//       name: "StoryCard",
+//       path: `${basePath}/StoryCard/index.js`
+//     },
+//     {
+//       name: "StorycardContent",
+//       path: `${basePath}/StorycardContent/index.js`
+//     },
+//     {
+//       name: "StoryElementCard",
+//       path: `${basePath}/StoryElementCard/index.js`
+//     },
+//     {
+//       name: "KeyEvents",
+//       path: `${basePath}/KeyEvents/index.js`
+//     },
+//     {
+//       name: "SocialShareTemplate",
+//       path: `${basePath}/SocialShareTemplate/index.js`
+//     },
+//     {
+//       name: "PageIntroductionCard",
+//       path: `${basePath}/PageIntroductionCard/index.js`
+//     }
+//   ];
+// }
+// function rowsEntryPoints() {
+//   const basePath = path.resolve(path.join(__dirname, "/components/Rows"));
+//   return [
+//     {
+//       name: "FourColGrid",
+//       path: `${basePath}/FourColGrid/index.js`
+//     },
+//     {
+//       name: "OneColStoryList",
+//       path: `${basePath}/OneColStoryList/index.js`
+//     },
+//     {
+//       name: "ThreeColGrid",
+//       path: `${basePath}/ThreeColGrid/index.js`
+//     },
+//     {
+//       name: "TwoColFourStories",
+//       path: `${basePath}/TwoColFourStory/index.js`
+//     },
+//     {
+//       name: "TwoColThreeStories",
+//       path: `${basePath}/TwoColThreeStory/index.js`
+//     },
+//     {
+//       name: "TwoColSevenStories",
+//       path: `${basePath}/TwoColSevenStories/index.js`
+//     },
+//     {
+//       name: "ThreeColSixStories",
+//       path: `${basePath}/ThreeColSixStories/index.js`
+//     },
+//     {
+//       name: "ThreeColSevenStory",
+//       path: `${basePath}/ThreeColSevenStory/index.js`
+//     },
+//     {
+//       name: "ElevenStories",
+//       path: `${basePath}/ElevenStories/index.js`
+//     },
+//     {
+//       name: "CollectionFilter",
+//       path: `${basePath}/CollectionFilter/index.js`
+//     },
+//     {
+//       name: "HalfScreenSlider",
+//       path: `${basePath}/HalfScreenSlider/index.js`
+//     },
+//     {
+//       name: "FourStorySlider",
+//       path: `${basePath}/FourStorySlider/index.js`
+//     },
+//     {
+//       name: "FourStorySliderPortrait",
+//       path: `${basePath}/FourStorySliderPortrait/index.js`
+//     },
+//     {
+//       name: "FullScreenSlider",
+//       path: `${basePath}/FullScreenSlider/index.js`
+//     },
+//     {
+//       name: "ThreeColFourteenStories",
+//       path: `${basePath}/ThreeColFourteenStory/index.js`
+//     },
+//     {
+//       name: "FourColTwelveStories",
+//       path: `${basePath}/FourColTwelveStory/index.js`
+//     },
+//     {
+//       name: "TagIntroductionCard",
+//       path: `${basePath}/TagIntroductionCard/index.js`
+//     },
+//     {
+//       name: "AuthorIntroductionCard",
+//       path: `${basePath}/AuthorIntroductionCard/index.js`
+//     },
+//     {
+//       name: "AsideCollection",
+//       path: `${basePath}/AsideCollection/index.js`
+//     },
+//     {
+//       name: "StoryCollection",
+//       path: `${basePath}/AsideCollection/index.js`
+//     },
+//     {
+//       name: "ListComponent",
+//       path: `${basePath}/ListComponent/index.js`
+//     },
+//     {
+//       name: "MagazineEditions",
+//       path: `${basePath}/MagazineEditions/index.js`
+//     },
+//     {
+//       name: "MagazineWidget",
+//       path: `${basePath}/MagazineWidget/index.js`
+//     },
+//     {
+//       name: "MagazineHeaderCard",
+//       path: `${basePath}/MagazineHeaderCard/index.js`
+//     },
+//     {
+//       name: "AuthorsList",
+//       path: `${basePath}/AuthorsList/index.js`
+//     },
+//     {
+//       name: "FourColSixteenStories",
+//       path: `${basePath}/FourColSixteenStories/index.js`
+//     },
+//     {
+//       name: "FourColFiveStories",
+//       path: `${basePath}/FourColFiveStories/index.js`
+//     },
+//     {
+//       name: "TwoColSixStories",
+//       path: `${basePath}/TwoColSixStories/index.js`
+//     },
+//     {
+//       name: "TwoColFourStoryHighlight",
+//       path: `${basePath}/TwoColFourStoryHighlight/index.js`
+//     },
+//     { name: "OpinionCollection", path: `${basePath}/OpinionCollection/index.js` },
+//     {
+//       name: "ThreeColFlexStories",
+//       path: `${basePath}/ThreeColFlexStories/index.js`
+//     },
+//     {
+//       name: "SixColSixStories",
+//       path: `${basePath}/SixColSixStories/index.js`
+//     },
+//     {
+//       name: "TwoColTenStoriesSidebar",
+//       path: `${basePath}/TwoColTenStoriesSidebar/index.js`
+//     },
+//     {
+//       name: "ThreeColTwelveStories",
+//       path: `${basePath}/ThreeColTwelveStories/index.js`
+//     },
+//     {
+//       name: "FourTabbedBigStorySlider",
+//       path: `${basePath}/FourTabbedBigStorySlider/index.js`
+//     },
+//     {
+//       name: "AlternateCollectionFilter",
+//       path: `${basePath}/AlternateCollectionFilter/index.js`
+//     },
+//     {
+//       name: "Listicles",
+//       path: `${basePath}/Listicles/index.js`
+//     },
+//     {
+//       name: "FourColPortraitStories",
+//       path: `${basePath}/FourColPortraitStories/index.js`
+//     },
+//     {
+//       name: "AstrologyCollection",
+//       path: `${basePath}/AstrologyCollection/index.js`
+//     }
+//   ];
+// }
+// function storyTemplateEntryPoints() {
+//   const basePath = path.resolve(path.join(__dirname, "/components/Rows"));
+//   return [
+//     {
+//       name: "VideoStoryTemplate",
+//       path: `${basePath}/StoryTemplates/VideoStoryTemplates/index.js`
+//     },
+//     {
+//       name: "TextStoryTemplate",
+//       path: `${basePath}/StoryTemplates/TextStoryTemplates/index.js`
+//     },
+//     {
+//       name: "LiveBlogStoryTemplate",
+//       path: `${basePath}/StoryTemplates/LiveBlogStorytemplates/index.js`
+//     },
+//     {
+//       name: "ListicleStoryTemplate",
+//       path: `${basePath}/StoryTemplates/ListicleStoryTemplates/index.js`
+//     },
+//     {
+//       name: "PhotoStoryTemplate",
+//       path: `${basePath}/StoryTemplates/PhotoStoryTemplates/index.js`
+//     }
+//   ];
+// }
+// module.exports = { getEntryPoints };

package/guide/stories.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { addReadme } from "storybook-readme";
+import readme from "../../README.md";
+import { storiesOf } from "@storybook/react";
+storiesOf("Introduction", module).addDecorator(addReadme).addDecorator(function (story) {
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      maxWidth: "900px",
+      margin: "auto"
+    }
+  }, story());
+}).addParameters({
+  options: {
+    showPanel: false
+  },
+  readme: {
+    content: readme,
+    codeTheme: "a11y-dark"
+  }
+}).add("Getting Started", function () {
+  return /*#__PURE__*/React.createElement("div", null);
+});

package/hydration-component/index.js

@@ -0,0 +1,41 @@
+import React, { useEffect, useRef } from "react";
+import ReactDOM from "react-dom";
+import useNearScreen from "./useNearScreen";
+import PropTypes from "prop-types";
+var EMPTY_HTML = {
+  __html: ""
+};
+var isServer = typeof window === "undefined";
+export var ProgressiveHydration = function ProgressiveHydration(props) {
+  var children = props.children;
+  var ref = useRef(null);
+  var isNearScreen = useNearScreen({
+    ref: ref
+  });
+  useEffect(function () {
+    var el = ref.current; // CLIENT:
+    // If we want to force the hydration OR the element is near screen
+    // then we hydrate the content to get the functionality ready
+
+    if (isNearScreen) {
+      var action = el.hasChildNodes() ? "hydrate" : "render";
+      ReactDOM[action](children, el);
+    }
+  }, [children, isNearScreen]); // SERVER: Just render the content as usual
+
+  if (isServer) {
+    return /*#__PURE__*/React.createElement("div", {
+      ref: ref
+    }, children);
+  } // CLIENT: Avoid hydration until we say so
+
+
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref,
+    suppressHydrationWarning: true,
+    dangerouslySetInnerHTML: EMPTY_HTML
+  });
+};
+ProgressiveHydration.propTypes = {
+  children: PropTypes.element
+};

package/hydration-component/useNearScreen.js

@@ -0,0 +1,71 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useState, useEffect } from "react";
+var observer;
+var isClient = typeof window !== "undefined";
+
+var hasIntersectionObserverSupport = function hasIntersectionObserverSupport() {
+  return typeof window.IntersectionObserver !== "undefined";
+}; // import intersection observer polyfill only if on client
+// and if not supported by browser
+
+
+var getIntersectionObserver = function getIntersectionObserver() {
+  return Promise.resolve(isClient && !hasIntersectionObserverSupport() && import("intersection-observer"));
+}; // options for intersection observer in order to improve the effect
+
+
+var intersectionObserverOptions = {
+  root: null,
+  // windows viewport will be used
+  rootMargin: "200px 0px 0px 0px"
+};
+
+var handleIntersect = function handleIntersect(entries, observer) {
+  entries.filter(function (entry) {
+    return entry.isIntersecting;
+  }).forEach(function (entry) {
+    var target = entry.target;
+
+    target._onIntersect(observer);
+  });
+}; // get observer from the cache or create a new one
+
+
+var getObserver = function getObserver() {
+  return getIntersectionObserver().then(function (_) {
+    if (observer) return observer;
+
+    if (isClient) {
+      return new window.IntersectionObserver(handleIntersect, intersectionObserverOptions);
+    }
+  });
+};
+
+export default (function (_ref) {
+  var ref = _ref.ref;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      show = _useState2[0],
+      setShow = _useState2[1];
+
+  useEffect(function () {
+    var current = ref.current;
+    if (!current) return; // get observer async and only when needed
+
+    getObserver().then(function (observer) {
+      return observer.observe(current);
+    }); // mutate the current target to add a method to be executed when intersecting
+
+    current._onIntersect = function (observer) {
+      setShow(true);
+      observer.unobserve(current);
+    }; // clean observed element when unmounted
+
+
+    return function () {
+      return current._isSubscribed = false;
+    };
+  }, [ref]);
+  return show;
+});

package/index.js

@@ -0,0 +1,88 @@
+// /**
+//  * IMPORTANT NOTE:
+//  * Please make sure to make a corresponding entry in entry-points.js
+//  * every export here needs to have a corresponding entry in entry-points.js
+//  */
+// // ATOMS
+// export { Author } from "./components/Atoms/Author";
+// export { AuthorWithTime } from "./components/Atoms/AuthorWithTimestamp";
+// export { CollectionName } from "./components/Atoms/CollectionName";
+// export { Headline } from "./components/Atoms/Headline";
+// export { HeroImage } from "./components/Atoms/HeroImage";
+// export { LoadmoreButton } from "./components/Atoms/Loadmore";
+// export { ExtendedLoadMore } from "./components/Atoms/ExtendedLoadMore";
+// export { SectionTag } from "./components/Atoms/SectionTag";
+// export { Subheadline } from "./components/Atoms/Subheadline";
+// export { TimeStamp } from "./components/Atoms/TimeStamp";
+// export { LoadMoreTarget } from "./components/Atoms/LoadMoreTarget";
+// export { ScrollSnap } from "./components/Atoms/ScrollSnap";
+// // STORY ELEMENTS
+// export { Text } from "./components/Atoms/StoryElements/Text";
+// export { Quote } from "./components/Atoms/StoryElements/Quote";
+// export { Blurb } from "./components/Atoms/StoryElements/Blurb";
+// export { AlsoRead } from "./components/Atoms/StoryElements/AlsoRead";
+// export { Summary } from "./components/Atoms/StoryElements/Summary";
+// export { BlockQuote } from "./components/Atoms/StoryElements/BlockQuote";
+// export { Image } from "./components/Atoms/StoryElements/Image";
+// export { Video } from "./components/Atoms/StoryElements/Video";
+// export { BigFact } from "./components/Atoms/StoryElements/BigFact";
+// export { StoryElement } from "./components/Atoms/StoryElements/StoryElement";
+// export { QuestionAnswer } from "./components/Atoms/StoryElements/QuestionAnswer";
+// export { ImageGallery } from "./components/Atoms/StoryElements/imageGallery";
+// export { Reference } from "./components/Atoms/StoryElements/Reference";
+// export { Attachment } from "./components/Atoms/StoryElements/Attachment";
+// export { ImageSlideshow } from "./components/Atoms/StoryElements/ImageSlideshow";
+// // MOLECULES
+// export { StoryCard } from "./components/Molecules/StoryCard";
+// export { StorycardContent } from "./components/Molecules/StorycardContent";
+// export { StoryElementCard } from "./components/Molecules/StoryElementCard";
+// export { SocialShareTemplate } from "./components/Molecules/SocialShareTemplate";
+// export { KeyEvents } from "./components/Molecules/KeyEvents";
+// export { PageIntroductionCard } from "./components/Molecules/PageIntroductionCard";
+// export { PortraitStoryCard } from "./components/Molecules/PortraitStoryCard";
+// // story templates
+// export { VideoStoryTemplate } from "./components/Rows/StoryTemplates/VideoStoryTemplates";
+// export { TextStoryTemplate } from "./components/Rows/StoryTemplates/TextStoryTemplates";
+// export { LiveBlogStoryTemplate } from "./components/Rows/StoryTemplates/LiveBlogStorytemplates";
+// export { ListicleStoryTemplate } from "./components/Rows/StoryTemplates/ListicleStoryTemplates";
+// export { PhotoStoryTemplate } from "./components/Rows/StoryTemplates/PhotoStoryTemplates";
+// // ROWS
+// export { FourColGrid } from "./components/Rows/FourColGrid";
+// export { OneColStoryList } from "./components/Rows/OneColStoryList";
+// export { ThreeColGrid } from "./components/Rows/ThreeColGrid";
+// export { TwoColFourStories } from "./components/Rows/TwoColFourStory";
+// export { TwoColThreeStories } from "./components/Rows/TwoColThreeStory";
+// export { TwoColSevenStories } from "./components/Rows/TwoColSevenStories";
+// export { ThreeColSixStories } from "./components/Rows/ThreeColSixStories";
+// export { ThreeColSevenStory } from "./components/Rows/ThreeColSevenStory";
+// export { ElevenStories } from "./components/Rows/ElevenStories";
+// export { CollectionFilter } from "./components/Rows/CollectionFilter";
+// export { HalfScreenSlider } from "./components/Rows/HalfScreenSlider";
+// export { FourStorySlider } from "./components/Rows/FourStorySlider";
+// export { FourStorySliderPortrait } from "./components/Rows/FourStorySliderPortrait";
+// export { FullScreenSlider } from "./components/Rows/FullScreenSlider";
+// export { ThreeColFourteenStories } from "./components/Rows/ThreeColFourteenStory";
+// export { FourColTwelveStories } from "./components/Rows/FourColTwelveStory";
+// export { TagIntroductionCard } from "./components/Rows/TagIntroductionCard";
+// export { AuthorIntroductionCard } from "./components/Rows/AuthorIntroductionCard";
+// export { AuthorsList } from "./components/Rows/AuthorsList";
+// export { AsideCollection } from "./components/Rows/AsideCollection";
+// export { StoryCollection } from "./components/Rows/AsideCollection";
+// export { ListComponent } from "./components/Rows/ListComponent";
+// export { MagazineEditions } from "./components/Rows/MagazineEditions";
+// export { MagazineWidget } from "./components/Rows/MagazineWidget";
+// export { MagazineHeaderCard } from "./components/Rows/MagazineHeaderCard";
+// export { FourColSixteenStories } from "./components/Rows/FourColSixteenStories";
+// export { FourColFiveStories } from "./components/Rows/FourColFiveStories";
+// export { TwoColSixStories } from "./components/Rows/TwoColSixStories";
+// export { TwoColFourStoryHighlight } from "./components/Rows/TwoColFourStoryHighlight";
+// export { OpinionCollection } from "./components/Rows/OpinionCollection";
+// export { ThreeColFlexStories } from "./components/Rows/ThreeColFlexStories";
+// export { SixColSixStories } from "./components/Rows/SixColSixStories";
+// export { TwoColTenStoriesSidebar } from "./components/Rows/TwoColTenStoriesSidebar";
+// export { ThreeColTwelveStories } from "./components/Rows/ThreeColTwelveStories";
+// export { FourTabbedBigStorySlider } from "./components/Rows/FourTabbedBigStorySlider";
+// export { AlternateCollectionFilter } from "./components/Rows/AlternateCollectionFilter";
+// export { FourColPortraitStories } from "./components/Rows/FourColPortraitStories";
+// export { AstrologyCollection } from "./components/Rows/AstrologyCollection";
+// export { Listicles } from "./components/Rows/Listicles";

package/package.json

@@ -1 +1 @@
-{"name":"@quintype/arrow","version":"3.15.1-perf.1","engines":{"node":">=12.0.0"},"description":"Quintype's UI Component Library for Publisher Apps","main":"cjs/index.js","module":"esm/index.js","repository":{"type":"git","url":"git+https://github.com/quintype/quintype-node-arrow.git"},"author":"dev-core@quintype.com","license":"ISC","bugs":{"url":"https://github.com/quintype/quintype-node-arrow/issues"},"peerDependencies":{"date-fns":"^2.28.0","date-fns-tz":"^1.3.1","lodash":"^4.0.0","react":">= 16.8.0","react-dom":">= 16.8.0","react-redux":">= 7.0.0"},"dependencies":{"@quintype/components":"^3.0.0","axios":"^0.19.2","date-fns":"^2.28.0","date-fns-tz":"^1.3.1","intersection-observer":"^0.11.0","react-image-lightbox":"^5.1.4","react-timeago":"^4.4.0"},"homepage":"https://github.com/quintype/quintype-node-arrow#readme"}
+{"name":"@quintype/arrow","version":"3.15.1-perf.10","engines":{"node":">=12.0.0"},"description":"Quintype's UI Component Library for Publisher Apps","repository":{"type":"git","url":"git+https://github.com/quintype/quintype-node-arrow.git"},"author":"dev-core@quintype.com","license":"ISC","bugs":{"url":"https://github.com/quintype/quintype-node-arrow/issues"},"peerDependencies":{"@babel/runtime":"^7.18.3","date-fns":"^2.28.0","date-fns-tz":"^1.3.1","lodash":"^4.0.0","react":">= 16.8.0","react-dom":">= 16.8.0","react-redux":">= 7.0.0","axios":"^0.23.0","@quintype/components":"^3.0.0","intersection-observer":"^0.11.0","react-image-lightbox":"^5.1.4","react-timeago":"^4.4.0"},"dependencies":{},"homepage":"https://github.com/quintype/quintype-node-arrow#readme"}

package/rows.js

@@ -0,0 +1,40 @@
+// // this file exists to create a seperate bundle just for rows
+// export { FourColGrid } from "./components/Rows/FourColGrid";
+// export { OneColStoryList } from "./components/Rows/OneColStoryList";
+// export { ThreeColGrid } from "./components/Rows/ThreeColGrid";
+// export { TwoColFourStories } from "./components/Rows/TwoColFourStory";
+// export { TwoColThreeStories } from "./components/Rows/TwoColThreeStory";
+// export { TwoColSevenStories } from "./components/Rows/TwoColSevenStories";
+// export { ThreeColSixStories } from "./components/Rows/ThreeColSixStories";
+// export { ThreeColSevenStory } from "./components/Rows/ThreeColSevenStory";
+// export { ElevenStories } from "./components/Rows/ElevenStories";
+// export { CollectionFilter } from "./components/Rows/CollectionFilter";
+// export { HalfScreenSlider } from "./components/Rows/HalfScreenSlider";
+// export { FourStorySlider } from "./components/Rows/FourStorySlider";
+// export { FourStorySliderPortrait } from "./components/Rows/FourStorySliderPortrait";
+// export { FullScreenSlider } from "./components/Rows/FullScreenSlider";
+// export { ThreeColFourteenStories } from "./components/Rows/ThreeColFourteenStory";
+// export { FourColTwelveStories } from "./components/Rows/FourColTwelveStory";
+// export { TagIntroductionCard } from "./components/Rows/TagIntroductionCard";
+// export { AuthorIntroductionCard } from "./components/Rows/AuthorIntroductionCard";
+// export { AuthorsList } from "./components/Rows/AuthorsList";
+// export { AsideCollection } from "./components/Rows/AsideCollection";
+// export { StoryCollection } from "./components/Rows/AsideCollection";
+// export { ListComponent } from "./components/Rows/ListComponent";
+// export { MagazineEditions } from "./components/Rows/MagazineEditions";
+// export { MagazineWidget } from "./components/Rows/MagazineWidget";
+// export { MagazineHeaderCard } from "./components/Rows/MagazineHeaderCard";
+// export { FourColSixteenStories } from "./components/Rows/FourColSixteenStories";
+// export { FourColFiveStories } from "./components/Rows/FourColFiveStories";
+// export { TwoColSixStories } from "./components/Rows/TwoColSixStories";
+// export { TwoColFourStoryHighlight } from "./components/Rows/TwoColFourStoryHighlight";
+// export { OpinionCollection } from "./components/Rows/OpinionCollection";
+// export { ThreeColFlexStories } from "./components/Rows/ThreeColFlexStories";
+// export { SixColSixStories } from "./components/Rows/SixColSixStories";
+// export { TwoColTenStoriesSidebar } from "./components/Rows/TwoColTenStoriesSidebar";
+// export { ThreeColTwelveStories } from "./components/Rows/ThreeColTwelveStories";
+// export { FourTabbedBigStorySlider } from "./components/Rows/FourTabbedBigStorySlider";
+// export { AlternateCollectionFilter } from "./components/Rows/AlternateCollectionFilter";
+// export { FourColPortraitStories } from "./components/Rows/FourColPortraitStories";
+// export { AstrologyCollection } from "./components/Rows/AstrologyCollection";
+// export { Listicles } from "./components/Rows/Listicles";

package/stylesheets/mixins.scss

@@ -0,0 +1,27 @@
+$mobile: 767px;
+$tablet: 768px;
+$desktop: 1025px;
+$desktop-lg: 1200px;
+
+@mixin mobile {
+  @media (max-width: #{$mobile}) {
+    @content;
+  }
+}
+
+@mixin tablet {
+  @media (min-width: #{$tablet}) {
+    @content;
+  }
+}
+@mixin desktop {
+  @media (min-width: #{$desktop}) {
+    @content;
+  }
+}
+
+@mixin desktop-lg {
+  @media (min-width: #{$desktop-lg}) {
+    @content;
+  }
+}