Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/ui / dist / components / organisms / MediaCarousel / renderProps.js
Size: Mime:
"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const exotic_1 = require("exotic");

const utils_1 = require("@skava/utils");

const Empty_1 = tslib_1.__importDefault(require("../../atoms/Empty"));

const CarouselBullet_1 = require("./CarouselBullet");

const CarouselArrow_1 = require("./CarouselArrow");

const deps_1 = require("./deps");

const styled_1 = require("./styled");

function defaultRenderArrows(props, state) {
  return react_1.default.createElement(CarouselArrow_1.CarouselArrow, Object.assign({}, props, {
    state: state
  }));
}

exports.defaultRenderArrows = defaultRenderArrows;

function defaultRenderBullets(props, state) {
  return react_1.default.createElement(CarouselBullet_1.CarouselBullet, Object.assign({}, props, {
    state: state
  }));
}

exports.defaultRenderBullets = defaultRenderBullets;

function defaultRenderItem(item, state) {
  const {
    src,
    itemHeight
  } = item;
  const validSrc = utils_1.toUrlWithProtocol(src);
  return react_1.default.createElement(styled_1.StyledImage, {
    src: validSrc,
    alt: validSrc,
    itemHeight: itemHeight
  });
}

exports.defaultRenderItem = defaultRenderItem;

function defaultRenderList(props, state) {
  const {
    renderItem,
    list,
    gridGap,
    itemHeight: oneItemHeight
  } = props,
        remainingProps = tslib_1.__rest(props, ["renderItem", "list", "gridGap", "itemHeight"]);

  const flexWidth = deps_1.getCarouselPanelWidth(Object.assign({
    list
  }, remainingProps));
  const margin = exotic_1.isSafe(gridGap) && exotic_1.fromIshToNumber(gridGap);
  const itemHeight = exotic_1.fromIshToNumber(oneItemHeight);
  return list && list.map((item, index) => {
    // const { ...remainingItemProps } = item
    const hasNavigationUrl = item && item.navigationUrl;
    const itemView = hasNavigationUrl ? react_1.default.createElement(styled_1.ItemNavigation, {
      href: item.navigationUrl || '/'
    }, renderItem(Object.assign({
      itemHeight,
      index
    }, item), state)) : renderItem(Object.assign({
      itemHeight,
      index
    }, item), state);
    return react_1.default.createElement(styled_1.ItemPanel, {
      key: index,
      gridGap: margin,
      flexWidth: flexWidth
    }, itemView);
  });
}

exports.defaultRenderList = defaultRenderList;

function defaultRenderCarouselPanel(props, state) {
  const {
    gridGap,
    hasArrows,
    hasBullets,
    renderList,
    renderArrows,
    renderBullets,
    handleArrowNavigation,
    swipingAttributes = {}
  } = props,
        remainingProps = tslib_1.__rest(props, ["gridGap", "hasArrows", "hasBullets", "renderList", "renderArrows", "renderBullets", "handleArrowNavigation", "swipingAttributes"]);

  const {
    list
  } = props;
  const margin = exotic_1.isNumber(gridGap) && exotic_1.fromIshToNumber(gridGap);
  const validHasArrows = exotic_1.toBoolean(hasArrows);
  const validHasBullets = exotic_1.toBoolean(hasBullets);
  const arrowView = validHasArrows ? renderArrows(remainingProps, state) : react_1.default.createElement(Empty_1.default, null);
  const bulletsView = validHasBullets ? renderBullets(remainingProps, state) : react_1.default.createElement(Empty_1.default, null);

  if (exotic_1.isNonEmptyArray(list) === true) {
    return react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(styled_1.CarouselPanel, {
      tabIndex: 0,
      onKeyDown: handleArrowNavigation
    }, react_1.default.createElement(styled_1.ItemListPanel, Object.assign({}, swipingAttributes), renderList(Object.assign({
      gridGap
    }, remainingProps), state)), arrowView), bulletsView);
  } else {
    return react_1.default.createElement(styled_1.StyledBlink, null, "There is no data to load!");
  }
}

exports.defaultRenderCarouselPanel = defaultRenderCarouselPanel;

function defaultRenderWrapper(props, state) {
  const {
    className,
    children
  } = props;
  return react_1.default.createElement(styled_1.CarouselWrapper, {
    className: className
  }, children);
}

exports.defaultRenderWrapper = defaultRenderWrapper; //# sourceMappingURL=renderProps.js.map