@elastic/ems-client 8.3.2 → 8.3.3

package/CHANGELOG.md

@@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
+## [8.3.3] - 2022-05-24
+
+- Make percentage an optional parameter #117
+- Make color and operation optional parameters #118
 
 ## [8.3.2] - 2022-05-16
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elastic/ems-client",
-  "version": "8.3.2",
+  "version": "8.3.3",
   "description": "JavaScript client library for the Elastic Maps Service",
   "main": "target/node/index.js",
   "browser": "target/web/index.js",

package/src/index.ts

@@ -8,3 +8,4 @@
 export { EMSClient, FileLayerField } from './ems_client';
 export { FileLayer } from './file_layer';
 export { TMSService, EmsSprite, EmsSpriteSheet } from './tms_service';
+export { blendMode } from './utils';

package/src/tms_service.ts

@@ -220,9 +220,9 @@ export class TMSService extends AbstractEmsService {
   */
   public static transformColorProperties(
     layer: LayerSpecification,
-    color: string,
-    operation: blendMode,
-    percentage: number
+    color?: string,
+    operation?: blendMode,
+    percentage?: number
   ): { property: keyof layerPaintProperty; color: mbColorDefinition | undefined }[] {
     if (['background', 'fill', 'line', 'symbol'].indexOf(layer.type) !== -1 && layer.paint) {
       const paint = layer.paint as layerPaintProperty;
@@ -250,7 +250,10 @@ export class TMSService extends AbstractEmsService {
         const paintColor = paint[type];
         return {
           property: type,
-          color: paintColor ? colorizeColor(paintColor, color, operation, percentage) : paintColor,
+          color:
+            paintColor && color
+              ? colorizeColor(paintColor, color, operation, percentage)
+              : paintColor,
         };
       });
     } else {

package/src/utils.ts

@@ -76,7 +76,7 @@ function transformColor(paintColor: mbColorDefinition, func: Function): mbColorD
       const newColor = transformColor(stop[1], func);
       return [stop[0], newColor];
     });
-    const newPaintColor = { ...paintColor, ...stops };
+    const newPaintColor = Object.assign({}, paintColor, { stops });
     return newPaintColor;
   } else return paintColor;
 }

package/target/index.d.ts

@@ -1,3 +1,4 @@
 export { EMSClient, FileLayerField } from './ems_client';
 export { FileLayer } from './file_layer';
 export { TMSService, EmsSprite, EmsSpriteSheet } from './tms_service';
+export { blendMode } from './utils';

package/target/node/index.js

@@ -39,9 +39,17 @@ Object.defineProperty(exports, "TMSService", {
     return _tms_service.TMSService;
   }
 });
+Object.defineProperty(exports, "blendMode", {
+  enumerable: true,
+  get: function () {
+    return _utils.blendMode;
+  }
+});
 
 var _ems_client = require("./ems_client");
 
 var _file_layer = require("./file_layer");
 
-var _tms_service = require("./tms_service");
+var _tms_service = require("./tms_service");
+
+var _utils = require("./utils");

package/target/node/tms_service.js

@@ -144,7 +144,7 @@ class TMSService extends _ems_service.AbstractEmsService {
         const paintColor = paint[type];
         return {
           property: type,
-          color: paintColor ? (0, _utils.colorizeColor)(paintColor, color, operation, percentage) : paintColor
+          color: paintColor && color ? (0, _utils.colorizeColor)(paintColor, color, operation, percentage) : paintColor
         };
       });
     } else {

package/target/node/utils.js

@@ -56,9 +56,9 @@ function transformColor(paintColor, func) {
       const newColor = transformColor(stop[1], func);
       return [stop[0], newColor];
     });
-    const newPaintColor = { ...paintColor,
-      ...stops
-    };
+    const newPaintColor = Object.assign({}, paintColor, {
+      stops
+    });
     return newPaintColor;
   } else return paintColor;
 }

package/target/tms_service.d.ts

@@ -47,7 +47,7 @@ export declare class TMSService extends AbstractEmsService {
     private _getVectorStyleJsonInlined;
     constructor(config: TMSServiceConfig, emsClient: EMSClient, proxyPath: string);
     static transformLanguageProperty(layer: LayerSpecification, lang: string): DataDrivenPropertyValueSpecification<FormattedSpecification> | undefined;
-    static transformColorProperties(layer: LayerSpecification, color: string, operation: blendMode, percentage: number): {
+    static transformColorProperties(layer: LayerSpecification, color?: string, operation?: blendMode, percentage?: number): {
         property: keyof layerPaintProperty;
         color: mbColorDefinition | undefined;
     }[];

package/target/web/index.js

@@ -6,4 +6,5 @@
  */
 export { EMSClient, FileLayerField } from './ems_client';
 export { FileLayer } from './file_layer';
-export { TMSService, EmsSprite, EmsSpriteSheet } from './tms_service';
+export { TMSService, EmsSprite, EmsSpriteSheet } from './tms_service';
+export { blendMode } from './utils';

package/target/web/tms_service.js

@@ -917,7 +917,7 @@ export var TMSService = /*#__PURE__*/function (_AbstractEmsService) {
           var paintColor = paint[type];
           return {
             property: type,
-            color: paintColor ? colorizeColor(paintColor, color, operation, percentage) : paintColor
+            color: paintColor && color ? colorizeColor(paintColor, color, operation, percentage) : paintColor
           };
         });
       } else {

package/target/web/utils.js

@@ -1,9 +1,3 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 /*
@@ -51,9 +45,9 @@ function transformColor(paintColor, func) {
       var newColor = transformColor(stop[1], func);
       return [stop[0], newColor];
     });
-
-    var newPaintColor = _objectSpread(_objectSpread({}, paintColor), stops);
-
+    var newPaintColor = Object.assign({}, paintColor, {
+      stops: stops
+    });
     return newPaintColor;
   } else return paintColor;
 }

package/test/ems_client_colour.test.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { LayerSpecification } from 'maplibre-gl';
+import { FillLayerSpecification, LayerSpecification } from 'maplibre-gl';
 import { TMSService } from '../src';
 import { mlLayerTypes } from './ems_client_util';
 import chroma from 'chroma-js';
@@ -76,4 +76,65 @@ describe('Transform colours', () => {
       },
     ]);
   });
+
+  it('should work with color expressions with stops', () => {
+    const inColor = chroma('#D36086');
+    const fillColors = [chroma('rgba(0,0,0,1)'), chroma('rgba(255,0,0,1)')];
+    const inOp = 'lighten';
+
+    const outColors = fillColors.map((fillColor) => {
+      return chroma.blend(fillColor, inColor, inOp);
+    });
+
+    const transform = TMSService.transformColorProperties;
+
+    const layerWithTextColor = {
+      id: 'layer',
+      type: 'fill',
+      source: '',
+      paint: {
+        'fill-color': {
+          base: 1,
+          stops: fillColors.map((fillColor) => {
+            return [1, chroma2css(fillColor)];
+          }),
+        } as unknown,
+      },
+    } as FillLayerSpecification;
+
+    const { color } = transform(layerWithTextColor, inColor.hex('rgba'), inOp, 0)[0];
+
+    expect(color).toEqual({
+      base: 1,
+      stops: outColors.map((fillColor) => {
+        return [1, chroma2css(fillColor)];
+      }),
+    });
+  });
+
+  it('should return the same colors if no input color is specified', () => {
+    const fillColors = ['#ff0000', '#00ff00', '#0000ff'];
+
+    const transform = TMSService.transformColorProperties;
+
+    const fillColorPaint = {
+      base: 1,
+      stops: fillColors.map((fillColor) => {
+        return [1, fillColor];
+      }),
+    };
+
+    const layerWithFillColor = {
+      id: 'layer',
+      type: 'fill',
+      paint: {
+        'fill-color': fillColorPaint,
+      } as unknown,
+    } as FillLayerSpecification;
+
+    const { color, property } = transform(layerWithFillColor)[0];
+
+    expect(property).toEqual('fill-color');
+    expect(color).toEqual(fillColorPaint);
+  });
 });