grid-template-parser/lib/grid.js

A simple CSS Grid template parser

'use strict';

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

var _primitives = require('./primitives');

var sep = /['"]\s*['"]?/g;
var ws = /\s+/g;

var cleanTpl = function cleanTpl(t) {
  return t.trim().slice(1, -1);
};
var cleanLine = function cleanLine(l) {
  return l.replace(ws, ' ').trim();
};

var getTpl = function getTpl(t) {
  return cleanTpl(t).split(sep);
};
var getRow = function getRow(l) {
  return cleanLine(l).split(' ');
};

var reduceLines = function reduceLines(acc, line, r) {
  if (line.trim() !== '') {
    getRow(line).forEach(function (area, c) {
      if (area !== '.') {
        if (typeof acc[area] === 'undefined') {
          acc[area] = {
            column: (0, _primitives.track)(c + 1, c + 2),
            row: (0, _primitives.track)(r + 1, r + 2)
          };
        } else {
          var _acc$area = acc[area],
              column = _acc$area.column,
              row = _acc$area.row;


          column.start = Math.min(column.start, c + 1);
          column.end = Math.max(column.end, c + 2);
          column.span = column.end - column.start;

          row.start = Math.min(row.start, r + 1);
          row.end = Math.max(row.end, r + 2);
          row.span = row.end - row.start;
        }
      }
    });
  }

  return acc;
};

var grid = exports.grid = function grid(tpl) {
  var lines = getTpl(tpl);
  var width = getRow(lines[0]).length;
  var height = lines.length;
  var areas = lines.reduce(reduceLines, {});

  return { width: width, height: height, areas: areas };
};