@quintype/arrow 3.15.1-perf.2 → 3.15.1-perf.5

package/atoms/CollectionName/styles.arrow.css

@@ -1 +0,0 @@
-.collection-name-m_collection__JD6sx{font-size:var(--arrow-fs-m);font-weight:var(--arrow-fw-bold);margin-bottom:var(--arrow-spacing-m)}@media (min-width:768px){.collection-name-m_collection__JD6sx{font-size:var(--arrow-fs-l);margin-bottom:var(--arrow-spacing-l)}}.collection-name-m_collection-borderLeft__3Dznk{align-items:baseline;display:flex}.collection-name-m_collection-borderLeft__3Dznk .collection-name-m_border-left__3_pYw{margin-right:var(--arrow-spacing-xs);min-width:5px;overflow:hidden;width:5px}.collection-name-m_collection-borderLeft__3Dznk .collection-name-m_border-left__3_pYw:before{content:"I";font-family:var(--arrow-sans-serif)}.collection-name-m_collection-borderBottomFull__Dkq3K{display:inline-block}.collection-name-m_collection-borderBottom__2rdQM{display:block}.collection-name-m_collection-crossLine__1sIpN{align-items:center;display:flex}.collection-name-m_collection-crossLine__1sIpN:before{border-top:1px solid var(--arrow-c-mono5);content:" ";flex:1 1 auto;margin-right:var(--arrow-spacing-l);position:relative}.collection-name-m_collection-crossLine__1sIpN:after{border-top:1px solid var(--arrow-c-mono5);content:" ";flex:1 1 auto;margin-left:var(--arrow-spacing-l);position:relative}html[dir=rtl] .collection-name-m_collection-borderLeft__3Dznk .collection-name-m_border-left__3_pYw{margin-left:var(--arrow-spacing-xs);margin-right:0}html[dir=rtl] .collection-name-m_collection-crossLine__1sIpN:before{margin-left:var(--arrow-spacing-l);margin-right:0}html[dir=rtl] .collection-name-m_collection-crossLine__1sIpN:after{margin-left:0;margin-right:var(--arrow-spacing-l)}.collection-name-m_border-bottom__1MnlV{height:4px;margin-top:var(--arrow-spacing-xxs);width:20px}.collection-name-m_collection-crossLine__1sIpN .collection-name-m_border-bottom__1MnlV{visibility:hidden}.collection-name-m_dark__nMe5H a,.collection-name-m_dark__nMe5H h2,.collection-name-m_dark__nMe5H h3,.collection-name-m_dark__nMe5H h5{color:var(--arrow-c-mono2)}.collection-name-m_light__1vFDN a,.collection-name-m_light__1vFDN h2,.collection-name-m_light__1vFDN h3,.collection-name-m_light__1vFDN h5{color:var(--arrow-c-invert-mono2)}

package/atoms/ExtendedLoadMore/index-0519e570.js

@@ -1,243 +0,0 @@
-import { a as get_1, g as getTextColor, _ as _getClassName, t as truncate, i as isEmpty, r as rgbToHex } from './index-ad3c83c3.js';
-import React from 'react';
-import { u as useStateValue, H as Headline, A as AuthorWithTime } from './index-1e444d20.js';
-import PropTypes from 'prop-types';
-import { H as HeroImage, S as SectionTag } from './index-c61a16dc.js';
-
-var _styleModuleImportMap$1 = {
-  "./subheadline.m.css": {
-    "subheadline": "subheadline-m_subheadline__3fd7z",
-    "dark": "subheadline-m_dark__28u00",
-    "light": "subheadline-m_light__2YUOe"
-  }
-};
-var Subheadline = function Subheadline(_ref) {
-  var story = _ref.story,
-      _ref$truncateChars = _ref.truncateChars,
-      truncateChars = _ref$truncateChars === void 0 ? 200 : _ref$truncateChars,
-      lineClamp = _ref.lineClamp,
-      _ref$clazzName = _ref.clazzName,
-      clazzName = _ref$clazzName === void 0 ? "" : _ref$clazzName,
-      forceShowAtom = _ref.forceShowAtom,
-      showFullContent = _ref.showFullContent;
-  var config = useStateValue() || {};
-  var subheadline = forceShowAtom || get_1(config, ["showSubheadline"], true);
-  if (!subheadline) return null;
-  var textColor = getTextColor(config.theme);
-  return /*#__PURE__*/React.createElement("div", {
-    style: {
-      WebkitLineClamp: lineClamp
-    },
-    "data-test-id": "subheadline",
-    className: ("p-alt arr--sub-headline arrow-component ".concat(clazzName) ? "p-alt arr--sub-headline arrow-component ".concat(clazzName) + " " : "") + _getClassName("subheadline ".concat(textColor), _styleModuleImportMap$1)
-  }, showFullContent || typeof lineClamp === "number" ? story.subheadline : truncate(story.subheadline, truncateChars, true));
-};
-Subheadline.propTypes = {
-  /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
-  //  Restricts the number of lines for subheadline.
-  lineClamp: PropTypes.number,
-
-  /** Number of characters to truncate the subheadline */
-  truncateChars: PropTypes.number,
-  clazzName: PropTypes.string,
-  forceShowAtom: PropTypes.bool,
-  showFullContent: PropTypes.bool
-};
-Subheadline.defaultProps = {
-  forceShowAtom: false,
-  showFullContent: false
-};
-
-var _styleModuleImportMap = {
-  "./storycard.m.css": {
-    "author-timestamp-wrapper": "storycard-m_author-timestamp-wrapper__20yjp",
-    "default-card": "storycard-m_default-card__1-POn",
-    "horizontal-card": "storycard-m_horizontal-card___7afz",
-    "backgroung-img": "storycard-m_backgroung-img__1FMJT",
-    "content-overlap": "storycard-m_content-overlap__1yNHR",
-    "border-full": "storycard-m_border-full__1nhy7",
-    "light": "storycard-m_light__3EhXN",
-    "dark": "storycard-m_dark__2wCTq",
-    "border-bottom": "storycard-m_border-bottom__2_E-I",
-    "border-boxShadow": "storycard-m_border-boxShadow__2-k3Z",
-    "center-align": "storycard-m_center-align__1Sn8-",
-    "content-bottom": "storycard-m_content-bottom__1QHeC",
-    "content-full": "storycard-m_content-full__2zJmU",
-    "content-boxShadow": "storycard-m_content-boxShadow__2IAWZ",
-    "hero-image": "storycard-m_hero-image__1H3MB",
-    "right-padding": "storycard-m_right-padding__12-lQ",
-    "horizontal-mob": "storycard-m_horizontal-mob__17JG2",
-    "content": "storycard-m_content__1Q9vq",
-    "border-default": "storycard-m_border-default__PEZ1x",
-    "card": "storycard-m_card__KJwRa",
-    "horizontal-image-last": "storycard-m_horizontal-image-last__3o6LY"
-  }
-};
-var StoryCard = function StoryCard(_ref) {
-  var story = _ref.story,
-      children = _ref.children,
-      isHorizontal = _ref.isHorizontal,
-      aspectRatio = _ref.aspectRatio,
-      border = _ref.border,
-      useImageAsBackground = _ref.useImageAsBackground,
-      bgImgContentOverlap = _ref.bgImgContentOverlap,
-      theme = _ref.theme,
-      borderColor = _ref.borderColor,
-      isHorizontalMobile = _ref.isHorizontalMobile,
-      centerAlign = _ref.centerAlign,
-      headerLevel = _ref.headerLevel,
-      hideAuthorImage = _ref.hideAuthorImage,
-      prefix = _ref.prefix,
-      config = _ref.config,
-      isHorizontalWithImageLast = _ref.isHorizontalWithImageLast;
-  if (!story || isEmpty(story)) return /*#__PURE__*/React.createElement("div", null);
-  var borderOptions = ["default", "full", "bottom", "boxShadow"];
-  var borderTemplate = borderOptions.includes(border) ? "border-".concat(border) : ""; // TODO optimize conditions
-
-  var horizontalCardStyle = "default-card";
-  if (isHorizontal) horizontalCardStyle = "horizontal-card";else if (isHorizontalWithImageLast) horizontalCardStyle = "horizontal-image-last";
-  var bgImageClasses = useImageAsBackground ? "backgroung-img" : "";
-  var bgImgContentOverlapClass = bgImgContentOverlap ? "content-overlap" : "";
-  var textColor = getTextColor(theme);
-  var horizontalMobileClasses = isHorizontalMobile ? "horizontal-mob" : "";
-  var defaultStorycard = /*#__PURE__*/React.createElement(DefaultStoryCard, {
-    story: story,
-    aspectRatio: aspectRatio,
-    border: border,
-    isHorizontalMobile: isHorizontalMobile,
-    isHorizontal: isHorizontal,
-    centerAlign: centerAlign,
-    headerLevel: headerLevel,
-    borderColor: borderColor,
-    hideAuthorImage: hideAuthorImage,
-    prefix: prefix,
-    config: config,
-    isHorizontalWithImageLast: isHorizontalWithImageLast
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    "data-test-id": "story-card",
-    style: {
-      backgroundColor: theme,
-      color: textColor
-    },
-    className: "arr--story-card " + _getClassName("card ".concat(horizontalCardStyle, " ").concat(borderTemplate, " ").concat(textColor, " ").concat(bgImageClasses, " ").concat(bgImgContentOverlapClass, " ").concat(horizontalMobileClasses), _styleModuleImportMap)
-  }, children || defaultStorycard);
-};
-
-var DefaultStoryCard = function DefaultStoryCard(_ref2) {
-  var story = _ref2.story;
-      _ref2.border;
-      var isHorizontal = _ref2.isHorizontal,
-      aspectRatio = _ref2.aspectRatio,
-      headerLevel = _ref2.headerLevel,
-      _ref2$isHorizontalMob = _ref2.isHorizontalMobile,
-      isHorizontalMobile = _ref2$isHorizontalMob === void 0 ? false : _ref2$isHorizontalMob,
-      _ref2$centerAlign = _ref2.centerAlign,
-      centerAlign = _ref2$centerAlign === void 0 ? false : _ref2$centerAlign,
-      borderColor = _ref2.borderColor,
-      hideAuthorImage = _ref2.hideAuthorImage,
-      prefix = _ref2.prefix,
-      isHorizontalWithImageLast = _ref2.isHorizontalWithImageLast,
-      config = _ref2.config;
-  var alignment = centerAlign ? "center-align" : "";
-  var SectionTagborderColor = rgbToHex(borderColor);
-  var _config$localizationC = config.localizationConfig,
-      localizationConfig = _config$localizationC === void 0 ? {} : _config$localizationC;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, isHorizontal ? /*#__PURE__*/React.createElement(HeroImage, {
-    config: config,
-    story: story,
-    isHorizontal: true,
-    isHorizontalMobile: isHorizontalMobile,
-    aspectRatio: aspectRatio
-  }) : isHorizontalWithImageLast ? /*#__PURE__*/React.createElement(HeroImage, {
-    config: config,
-    story: story,
-    isHorizontalWithImageLast: true,
-    isHorizontalMobile: isHorizontalMobile,
-    aspectRatio: aspectRatio
-  }) : /*#__PURE__*/React.createElement(HeroImage, {
-    story: story,
-    config: config,
-    isHorizontalMobile: isHorizontalMobile,
-    aspectRatio: aspectRatio
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "arr--story-content " + _getClassName("content ".concat(alignment), _styleModuleImportMap)
-  }, /*#__PURE__*/React.createElement(SectionTag, {
-    story: story,
-    borderColor: SectionTagborderColor
-  }), /*#__PURE__*/React.createElement(Headline, {
-    story: story,
-    headerLevel: headerLevel,
-    premiumStoryIconConfig: config
-  }), /*#__PURE__*/React.createElement(AuthorWithTime, {
-    config: localizationConfig,
-    story: story,
-    isBottom: true,
-    prefix: prefix,
-    hideAuthorImage: hideAuthorImage
-  }), /*#__PURE__*/React.createElement(Subheadline, {
-    story: story
-  })));
-};
-
-DefaultStoryCard.propTypes = {
-  story: PropTypes.object.isRequired,
-  border: PropTypes.oneOfType([PropTypes.string]),
-  isBottom: PropTypes.bool,
-  isHorizontal: PropTypes.bool,
-  aspectRatio: PropTypes.oneOfType([PropTypes.array]),
-  isHorizontalMobile: PropTypes.bool,
-  centerAlign: PropTypes.bool,
-  headerLevel: PropTypes.string,
-  borderColor: PropTypes.string,
-  hideAuthorImage: PropTypes.bool,
-  prefix: PropTypes.string,
-  config: PropTypes.object,
-  isHorizontalWithImageLast: PropTypes.bool
-};
-StoryCard.propTypes = {
-  /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
-  children: PropTypes.node,
-
-  /** Flip the Story Card to Horizonal mode */
-  isHorizontal: PropTypes.bool,
-
-  /** Add border to the Story Card  */
-  border: PropTypes.oneOfType([PropTypes.string]),
-  // story card with background image
-  useImageAsBackground: PropTypes.bool,
-  // story card  content overlap with image
-  bgImgContentOverlap: PropTypes.bool,
-
-  /** add aspect ratio for hero image  */
-  aspectRatio: PropTypes.oneOfType([PropTypes.array]),
-
-  /** add theme(dark /light/custom color) for storycard  */
-  theme: PropTypes.string,
-
-  /** flip the story card mobile design horizontal */
-  isHorizontalMobile: PropTypes.bool,
-  // make content center align in desktop and left align in mobile
-  centerAlign: PropTypes.bool,
-  headerLevel: PropTypes.string,
-  borderColor: PropTypes.string,
-  // handle author image through storycard
-  hideAuthorImage: PropTypes.bool,
-  // handle author prefix through storycard
-  prefix: PropTypes.string,
-  config: PropTypes.object,
-  isHorizontalWithImageLast: PropTypes.bool
-};
-StoryCard.defaultProps = {
-  isHorizontal: false,
-  isHorizontalMobile: false,
-  border: "default",
-  theme: "",
-  centerAlign: false,
-  borderColor: "",
-  isHorizontalWithImageLast: false
-};
-
-export { StoryCard as S, Subheadline as a };

package/atoms/ExtendedLoadMore/index-1256e453.js

@@ -1,175 +0,0 @@
-import React, { Fragment } from 'react';
-import { g as getTextColor, a as get_1, l as getSlot, b as generateNavigateSlug, n as navigateTo } from './index-ad3c83c3.js';
-import { S as StoryCard } from './index-0519e570.js';
-import { H as HeroImage } from './index-c61a16dc.js';
-import { S as StorycardContent } from './index-81eb3978.js';
-import { C as CollectionName, S as StateProvider, L as LoadMoreTarget, P as ProgressiveHydration, a as LoadmoreButton } from './index-1e444d20.js';
-import { collectionToStories } from '@quintype/components';
-import PropTypes from 'prop-types';
-import { useDispatch, useSelector } from 'react-redux';
-import 'react-timeago';
-import 'date-fns-tz';
-import 'react-dom';
-
-var loadMore = function loadMore(_ref) {
-  var isLoading = _ref.isLoading,
-      storyItems = _ref.storyItems,
-      getMoreStories = _ref.getMoreStories,
-      _ref$subsequentLoadCo = _ref.subsequentLoadCount,
-      subsequentLoadCount = _ref$subsequentLoadCo === void 0 ? 3 : _ref$subsequentLoadCo;
-  if (isLoading) return;
-  var limit = subsequentLoadCount;
-  var offset = storyItems.length;
-  getMoreStories(offset, limit);
-};
-
-var ThreeColGridBase = function ThreeColGridBase(_ref2) {
-  var collection = _ref2.collection,
-      _ref2$config = _ref2.config,
-      config = _ref2$config === void 0 ? {} : _ref2$config,
-      getMoreStories = _ref2.getMoreStories,
-      isLoadMoreVisible = _ref2.isLoadMoreVisible,
-      isLoading = _ref2.isLoading,
-      isolatedLoadMore = _ref2.isolatedLoadMore;
-  var _config$collectionNam = config.collectionNameBorderColor,
-      collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
-      _config$borderColor = config.borderColor,
-      borderColor = _config$borderColor === void 0 ? "" : _config$borderColor,
-      _config$theme = config.theme,
-      theme = _config$theme === void 0 ? "" : _config$theme,
-      _config$slotConfig = config.slotConfig,
-      slotConfig = _config$slotConfig === void 0 ? [] : _config$slotConfig,
-      _config$border = config.border,
-      border = _config$border === void 0 ? "" : _config$border,
-      _config$collectionNam2 = config.collectionNameTemplate,
-      collectionNameTemplate = _config$collectionNam2 === void 0 ? "" : _config$collectionNam2,
-      _config$footerSlotCon = config.footerSlotConfig,
-      footerSlotConfig = _config$footerSlotCon === void 0 ? {} : _config$footerSlotCon,
-      _config$footerButton = config.footerButton,
-      footerButton = _config$footerButton === void 0 ? "" : _config$footerButton,
-      _config$subsequentLoa = config.subsequentLoadCount,
-      subsequentLoadCount = _config$subsequentLoa === void 0 ? 3 : _config$subsequentLoa;
-  var storyItems = collectionToStories(collection);
-  if (!storyItems.length) return null;
-  var textColor = getTextColor(theme);
-  var footerSlot = footerSlotConfig.footerSlot;
-  var footerSlotComp = footerSlot ? footerSlot() : null;
-
-  var _get = get_1(slotConfig, [0], {}),
-      _get$type = _get.type,
-      type = _get$type === void 0 ? "" : _get$type,
-      component = _get.component;
-
-  var adWidgetSlot = type === "ad" || type === "widget" ? getSlot(type, component) : null;
-  var dispatch = useDispatch();
-  var qtConfig = useSelector(function (state) {
-    return get_1(state, ["qt", "config"], {});
-  });
-
-  var getLoadMore = function getLoadMore(opts) {
-    if (!isLoadMoreVisible) return null;
-
-    if (isolatedLoadMore) {
-      return /*#__PURE__*/React.createElement(LoadMoreTarget, {
-        collection: collection,
-        componentName: "ThreeColGrid",
-        offset: storyItems.length,
-        limit: subsequentLoadCount
-      });
-    }
-
-    var url = generateNavigateSlug(collection, qtConfig);
-    return /*#__PURE__*/React.createElement(ProgressiveHydration, null, /*#__PURE__*/React.createElement(LoadmoreButton, {
-      config: config,
-      collection: collection,
-      template: footerButton,
-      onClick: function onClick() {
-        return loadMore(opts);
-      },
-      navigate: function navigate() {
-        return navigateTo(dispatch, url);
-      },
-      qtConfig: qtConfig
-    }));
-  };
-
-  var storyCard = function storyCard(story) {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "three-col-m_cards__2HyyK"
-    }, /*#__PURE__*/React.createElement(StoryCard, {
-      story: story,
-      border: border,
-      theme: theme,
-      isHorizontalMobile: true,
-      config: config
-    }, /*#__PURE__*/React.createElement(HeroImage, {
-      aspectRatio: [[16, 9]],
-      story: story,
-      isHorizontalMobile: true
-    }), /*#__PURE__*/React.createElement(StorycardContent, {
-      theme: theme,
-      border: border,
-      story: story,
-      isHorizontalMobile: true,
-      borderColor: borderColor,
-      config: config
-    })));
-  };
-
-  return /*#__PURE__*/React.createElement("div", {
-    className: "full-width-with-padding arrow-component",
-    "data-test-id": "three-col-grid",
-    style: {
-      backgroundColor: theme,
-      color: textColor
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "three-col-m_three-col-grid__y7rZK"
-  }, /*#__PURE__*/React.createElement(CollectionName, {
-    collection: collection,
-    collectionNameTemplate: collectionNameTemplate,
-    collectionNameBorderColor: collectionNameBorderColor
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "three-col-m_wrapper__20m5m"
-  }, storyItems.slice(0, 2).map(function (story, index) {
-    return /*#__PURE__*/React.createElement(Fragment, {
-      key: "story-3col1-".concat(index, "-").concat(get_1(story, ["id"], "0"))
-    }, storyCard(story));
-  }), storyItems.length < 2 && /*#__PURE__*/React.createElement("div", null), adWidgetSlot, storyItems.slice(2).map(function (story, index) {
-    return /*#__PURE__*/React.createElement(Fragment, {
-      key: "story-3col1-".concat(index, "-").concat(get_1(story, ["id"], "0"))
-    }, storyCard(story));
-  })), getLoadMore({
-    isLoading: isLoading,
-    storyItems: storyItems,
-    getMoreStories: getMoreStories,
-    subsequentLoadCount: subsequentLoadCount
-  }), footerSlotComp));
-};
-ThreeColGridBase.propTypes = {
-  /**  collection is the array of objects which is returning by API  */
-  collection: PropTypes.object.isRequired,
-
-  /** The config for the Row */
-  config: PropTypes.shape({
-    theme: PropTypes.string,
-    border: PropTypes.bool,
-    slotConfig: PropTypes.array,
-    footerButton: PropTypes.string,
-    collectionNameTemplate: PropTypes.string,
-    collectionNameBorderColor: PropTypes.string,
-    subsequentLoadCount: PropTypes.number
-  }),
-  getMoreStories: PropTypes.func,
-  isLoadMoreVisible: PropTypes.bool,
-  isLoading: PropTypes.bool,
-  isolatedLoadMore: PropTypes.bool
-};
-ThreeColGridBase.defaultProps = {
-  getMoreStories: function getMoreStories() {},
-  isLoadMoreVisible: true,
-  isLoading: false
-};
-var ThreeColGrid = StateProvider(ThreeColGridBase);
-
-export { ThreeColGrid, ThreeColGridBase };