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 / atoms / Placeholder / ParagraphPlaceholder / ParagraphPlaceholder.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 Vector_1 = tslib_1.__importDefault(require("../../Vector"));

const TextPlaceholder_1 = tslib_1.__importDefault(require("../TextPlaceholder"));

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

class ParagraphPlaceholder extends react_1.default.PureComponent {
  constructor() {
    super(...arguments);

    this.getRowStyle = i => {
      let {
        rows,
        widthList,
        height,
        itemHeight,
        lineSpacing
      } = this.props;
      itemHeight = deps_1.stripMeasurement(itemHeight);
      lineSpacing = deps_1.stripMeasurement(lineSpacing);
      const lineYPosition = i * (itemHeight + lineSpacing);
      return {
        // maxHeight: `${100 / (rows * 2 - 1)}%`,
        width: `${widthList[(i + widthList.length) % widthList.length]}%`,
        height: itemHeight,
        transform: `translate(0, ${lineYPosition}px)`
      };
    };

    this.getRows = () => {
      const {
        rows,
        lineSpacing
      } = this.props;
      const range = Array.apply(undefined, Array(rows));
      return range.map((_, i) => react_1.default.createElement(TextPlaceholder_1.default, {
        nowrap: true,
        style: this.getRowStyle(i),
        lineSpacing: i !== 0 ? lineSpacing : 0,
        key: i
      }));
    };
  }

  render() {
    let _a = this.props,
        {
      fill,
      widthList,
      rows,
      height,
      itemHeight,
      lineSpacing
    } = _a,
        remainingProps = tslib_1.__rest(_a, ["fill", "widthList", "rows", "height", "itemHeight", "lineSpacing"]); // @note this


    itemHeight = deps_1.stripMeasurement(itemHeight);
    lineSpacing = deps_1.stripMeasurement(lineSpacing);
    height = deps_1.stripMeasurement(height); // providing priority only to the rows

    let itemLength = rows ? rows : widthList.length;
    height = itemLength * (itemHeight + lineSpacing);
    const viewBox = `0 0 100% ${height}`;
    const attributes = Object.assign({
      viewBox,
      height
    }, remainingProps);
    return react_1.default.createElement(Vector_1.default, Object.assign({}, attributes), this.getRows());
  }

}

ParagraphPlaceholder.defaultProps = {
  widthList: [97, 100, 94, 90, 98, 95, 98, 40],
  rows: 8,
  width: '100%',
  height: '100%',
  itemHeight: 24,
  lineSpacing: 10,
  isDynamicViewBox: true
};
exports.ParagraphPlaceholder = ParagraphPlaceholder;
exports.default = ParagraphPlaceholder; //# sourceMappingURL=ParagraphPlaceholder.js.map