Styles.js 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. import {
  2. isArray,
  3. assign,
  4. reduce
  5. } from 'min-dash';
  6. /**
  7. * A component that manages shape styles
  8. */
  9. export default function Styles() {
  10. var defaultTraits = {
  11. 'no-fill': {
  12. fill: 'none'
  13. },
  14. 'no-border': {
  15. strokeOpacity: 0.0
  16. },
  17. 'no-events': {
  18. pointerEvents: 'none'
  19. }
  20. };
  21. var self = this;
  22. /**
  23. * Builds a style definition from a className, a list of traits and an object of additional attributes.
  24. *
  25. * @param {String} className
  26. * @param {Array<String>} traits
  27. * @param {Object} additionalAttrs
  28. *
  29. * @return {Object} the style defintion
  30. */
  31. this.cls = function(className, traits, additionalAttrs) {
  32. var attrs = this.style(traits, additionalAttrs);
  33. return assign(attrs, { 'class': className });
  34. };
  35. /**
  36. * Builds a style definition from a list of traits and an object of additional attributes.
  37. *
  38. * @param {Array<String>} traits
  39. * @param {Object} additionalAttrs
  40. *
  41. * @return {Object} the style defintion
  42. */
  43. this.style = function(traits, additionalAttrs) {
  44. if (!isArray(traits) && !additionalAttrs) {
  45. additionalAttrs = traits;
  46. traits = [];
  47. }
  48. var attrs = reduce(traits, function(attrs, t) {
  49. return assign(attrs, defaultTraits[t] || {});
  50. }, {});
  51. return additionalAttrs ? assign(attrs, additionalAttrs) : attrs;
  52. };
  53. this.computeStyle = function(custom, traits, defaultStyles) {
  54. if (!isArray(traits)) {
  55. defaultStyles = traits;
  56. traits = [];
  57. }
  58. return self.style(traits || [], assign({}, defaultStyles, custom || {}));
  59. };
  60. }