@antv/f6-ui/es/parser/attr-parser.js

UI system for @antv/f6

import { isColor, typeParser } from '../utils/parser';
var attributesMap = {};
export function registerAttr(attr, parser) {
  if (!attr) return;
  var arr = attr;
  if (!Array.isArray(arr)) arr = [arr];
  arr.forEach(function (attr) {
    if (typeof parser === 'function') {
      attributesMap[attr] = parser;
    } else {
      attributesMap[attr] = typeParser;
    }
  });
}

var boxParser = function boxParser(type, value) {
  var style = {};
  var arr = value.split(/\s/g).filter(function (s) {
    return s !== '';
  });

  if (arr.length === 1 && !isNaN(arr[0])) {
    style["" + type] = Number(arr[0]);
  }

  if (arr.length === 2) {
    !isNaN(Number(arr[0])) && (style[type + "Bottom"] = style[type + "Top"] = Number(arr[0]));
    !isNaN(Number(arr[1])) && (style[type + "Left"] = style[type + "Right"] = Number(arr[1]));
  }

  if (arr.length === 3) {
    !isNaN(Number(arr[0])) && (style[type + "Top"] = Number(arr[0]));
    !isNaN(Number(arr[1])) && (style[type + "Left"] = style[type + "Right"] = Number(arr[1]));
    !isNaN(Number(arr[2])) && (style[type + "Bottom"] = Number(arr[2]));
  }

  if (arr.length === 4) {
    !isNaN(Number(arr[0])) && (style[type + "Top"] = Number(arr[0]));
    !isNaN(Number(arr[1])) && (style[type + "Right"] = Number(arr[1]));
    !isNaN(Number(arr[2])) && (style[type + "Bottom"] = Number(arr[2]));
    !isNaN(Number(arr[3])) && (style[type + "Left"] = Number(arr[3]));
  }

  return style;
};

var borderRadiusParser = function borderRadiusParser(value) {
  var style = {};
  var arr = value.split(/\s/g).filter(function (s) {
    return s !== '';
  });

  if (arr.length === 1 && !isNaN(arr[0])) {
    style["borderTopLeftRadius"] = Number(arr[0]);
    style["borderTopRightRadius"] = Number(arr[0]);
    style["borderBottomRightRadius"] = Number(arr[0]);
    style["borderBottomLeftRadius"] = Number(arr[0]);
  }

  if (arr.length === 2) {
    !isNaN(Number(arr[0])) && (style["borderTopLeftRadius"] = style["borderBottomRightRadius"] = Number(arr[0]));
    !isNaN(Number(arr[2])) && (style["borderBottomLeftRadius"] = style["borderTopRightRadius"] = Number(arr[1]));
  }

  if (arr.length === 3) {
    !isNaN(Number(arr[0])) && (style["borderTopLeftRadius"] = Number(arr[0]));
    !isNaN(Number(arr[1])) && (style["borderBottomLeftRadius"] = style["borderTopRightRadius"] = Number(arr[1]));
    !isNaN(Number(arr[2])) && (style["borderBottomRightRadius"] = Number(arr[2]));
  }

  if (arr.length === 4) {
    !isNaN(Number(arr[0])) && (style["borderTopLeftRadius"] = Number(arr[0]));
    !isNaN(Number(arr[1])) && (style["borderTopRightRadius"] = Number(arr[1]));
    !isNaN(Number(arr[2])) && (style["borderBottomRightRadius"] = Number(arr[2]));
    !isNaN(Number(arr[3])) && (style["borderBottomLeftRadius"] = Number(arr[3]));
  }

  return style;
};

var backgroundParser = function backgroundParser(value) {
  var style = {};
  var arr = value.split(/\s/g).filter(function (s) {
    return s !== '';
  });

  for (var _i = 0, arr_1 = arr; _i < arr_1.length; _i++) {
    value = arr_1[_i];

    if (isColor(value)) {
      style['backgroundColor'] = value;
    } else if (value === null || value === void 0 ? void 0 : value.startsWith('url')) {
      var match = value.match(/url\((.+?)\)/);
      match && (style['backgroundImage'] = match[1]);
    }
  }

  return style;
};

var borders = ['solid', 'dashed'];

var borderParser = function borderParser(value) {
  var style = {};
  var arr = value.split(/\s/g).filter(function (s) {
    return s !== '';
  });

  for (var _i = 0, arr_2 = arr; _i < arr_2.length; _i++) {
    var value_1 = arr_2[_i];

    if (!isNaN(Number(value_1))) {
      style['borderWidth'] = Number(value_1);
    } else if (isColor(value_1)) {
      style['borderColor'] = value_1;
    } else if (borders.includes(value_1)) {
      style['borderStyle'] = value_1;
    }
  }

  return style;
};

var shadowParser = function shadowParser(value) {
  var style = {};
  var arr = value.split(/\s/g).filter(function (s) {
    return s !== '';
  });
  var propers = ['shadowOffsetX', 'shadowOffsetY', 'shadowBlur', 'shadowColor'];

  while (arr.length) {
    var value_2 = arr.shift();

    if (!isNaN(Number(value_2))) {
      var key = propers.shift();
      style[key] = Number(value_2);
      continue;
    } else if (isColor(value_2)) {
      style['shadowColor'] = value_2;
    }
  }

  return style;
};

registerAttr('padding', boxParser.bind(null, 'padding'));
registerAttr('margin', boxParser.bind(null, 'margin'));
registerAttr('border-radius', borderRadiusParser);
registerAttr('border', borderParser);
registerAttr('background', backgroundParser);
registerAttr(['box-shadow', 'text-shadow'], shadowParser);
export function parseAttr(key, value) {
  if (attributesMap[key]) {
    return attributesMap[key](value);
  }

  try {
    return typeParser(value);
  } catch (e) {
    console.error(e);
    return value;
  }
}