@rio-cloud/rio-uikit 0.16.2-beta.16 → 0.16.2-beta.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/components/map/components/Map.js +4 -1
  2. package/components/map/components/features/basics/Polyline.js +33 -12
  3. package/components/map/components/features/layers/baselayers/useBaseLayer.js +4 -2
  4. package/components/map/components/features/settings/builtinSettings/MapTypeSettings.js +2 -1
  5. package/lib/es/components/map/components/Map.js +4 -1
  6. package/lib/es/components/map/components/features/basics/Polyline.js +33 -12
  7. package/lib/es/components/map/components/features/layers/baselayers/useBaseLayer.js +4 -2
  8. package/lib/es/components/map/components/features/settings/builtinSettings/MapTypeSettings.js +2 -1
  9. package/lib/es/styles/design/divider.less +90 -0
  10. package/lib/es/styles/design/responsive/spacing.less +2 -2
  11. package/lib/es/styles/rio-uikit-core.less +1 -1
  12. package/lib/es/version.json +1 -1
  13. package/package.json +1 -1
  14. package/styles/design/divider.less +90 -0
  15. package/styles/design/responsive/spacing.less +2 -2
  16. package/styles/rio-uikit-core.less +1 -1
  17. package/version.json +1 -1
package/components/map/components/Map.js CHANGED
@@ -211,7 +211,9 @@ var Map = function Map(props) {
211
211
  zoom: zoom,
212
212
  center: center,
213
213
  bounds: bounds,
214
- pixelRatio: devicePixelRatio
214
+ pixelRatio: devicePixelRatio,
215
+ // need to be set for better performence of legacy map
216
+ engineType: enableWebGL ? undefined : H.map.render.RenderEngine.EngineType.P2D
215
217
  };
216
218
  var hereMap = new H.Map(mapRef.current, defaultLayer, mapConfig);
217
219
 
@@ -239,6 +241,7 @@ var Map = function Map(props) {
239
241
  ui: getHereUi(hereMap, defaultLayers, showScaleBar),
240
242
  utils: createUtils(hereMap),
241
243
  settings: {
244
+ enableWebGL: enableWebGL,
242
245
  baseLayer: baseLayer,
243
246
  mapLayer: activeLayers,
244
247
  showCluster: showCluster
package/components/map/components/features/basics/Polyline.js CHANGED
@@ -36,18 +36,39 @@ var Polyline = function Polyline(_ref) {
36
36
  style: style
37
37
  });
38
38
  if (hasArrows) {
39
- // Create a patterned polyline
40
- var arrowLineStyle = new H.map.SpatialStyle(_objectSpread(_objectSpread({}, arrowStyle), {}, {
41
- lineWidth: 10,
42
- strokeColor: 'rgba(0, 0, 0, 0.8)',
43
- lineDash: [0, 3],
44
- lineDashOffset: 1.6,
45
- lineTailCap: 'arrow-tail',
46
- lineHeadCap: 'arrow-head'
47
- }));
48
- var routeArrows = new H.map.Polyline(geometry, {
49
- style: arrowLineStyle
50
- });
39
+ var routeArrows;
40
+ if (api.settings.enableWebGL) {
41
+ // Create a patterned polyline
42
+ var arrowLineStyle = new H.map.SpatialStyle(_objectSpread(_objectSpread({}, arrowStyle), {}, {
43
+ lineWidth: 10,
44
+ strokeColor: 'rgba(0, 0, 0, 0.8)',
45
+ lineDash: [0, 3],
46
+ lineDashOffset: 1.6,
47
+ lineTailCap: 'arrow-tail',
48
+ lineHeadCap: 'arrow-head'
49
+ }));
50
+ routeArrows = new H.map.Polyline(geometry, {
51
+ style: arrowLineStyle
52
+ });
53
+ } else {
54
+ // Non WebGL way - Create a patterned polyline
55
+ var defaultArrowStyle = {
56
+ lineWidth: 2,
57
+ fillColor: 'rgba(42, 55, 64, 1)',
58
+ strokeColor: 'rgba(0, 0, 0, 0.8)',
59
+ lineDash: [0, 4],
60
+ lineTailCap: 'arrow-tail',
61
+ lineHeadCap: 'arrow-head'
62
+ };
63
+ var _arrowLineStyle = new H.map.SpatialStyle({
64
+ lineWidth: 10,
65
+ strokeColor: 'rgba(255, 255, 255, 0)'
66
+ });
67
+ routeArrows = new H.map.Polyline(geometry, {
68
+ style: _arrowLineStyle,
69
+ arrows: defaultArrowStyle
70
+ });
71
+ }
51
72
 
52
73
  // create a group that represents the route line and contains
53
74
  // outline and the pattern
package/components/map/components/features/layers/baselayers/useBaseLayer.js CHANGED
@@ -41,10 +41,12 @@ export var useBaseLayer = function useBaseLayer(props) {
41
41
  useEffect(function () {
42
42
  if (!baseLayer) {
43
43
  var additionalParametersWithLocale = _objectSpread(_objectSpread({}, additionalParameters), {}, {
44
- lg: mapToLongLocale(language)
44
+ lg: mapToLongLocale(language),
45
45
  // ppi: getPPI(),
46
- });
47
46
 
47
+ // need to be set for better performence of legacy map
48
+ engineType: isWebGL ? undefined : H.map.render.RenderEngine.EngineType.P2D
49
+ });
48
50
  var defaultLayers = api.platform.createDefaultLayers(additionalParametersWithLocale);
49
51
  var newBaseLayer = getDefaultBaseLayer(defaultLayers, mapType, isWebGL);
50
52
  api.map.setBaseLayer(newBaseLayer);
package/components/map/components/features/settings/builtinSettings/MapTypeSettings.js CHANGED
@@ -117,7 +117,8 @@ var MapTypeSettings = function MapTypeSettings(props) {
117
117
  };
118
118
  MapTypeSettings.displayName = 'MapTypeSettings';
119
119
  MapTypeSettings.defaultProps = {
120
- onMapTypeChange: function onMapTypeChange() {}
120
+ onMapTypeChange: function onMapTypeChange() {},
121
+ enableNightMap: true
121
122
  };
122
123
  MapTypeSettings.propTypes = {
123
124
  mapType: PropTypes.string,
package/lib/es/components/map/components/Map.js CHANGED
@@ -222,7 +222,9 @@ var Map = function Map(props) {
222
222
  zoom: zoom,
223
223
  center: center,
224
224
  bounds: bounds,
225
- pixelRatio: devicePixelRatio
225
+ pixelRatio: devicePixelRatio,
226
+ // need to be set for better performence of legacy map
227
+ engineType: enableWebGL ? undefined : H.map.render.RenderEngine.EngineType.P2D
226
228
  };
227
229
  var hereMap = new H.Map(mapRef.current, defaultLayer, mapConfig);
228
230
 
@@ -250,6 +252,7 @@ var Map = function Map(props) {
250
252
  ui: getHereUi(hereMap, defaultLayers, showScaleBar),
251
253
  utils: (0, _mapUtils.createUtils)(hereMap),
252
254
  settings: {
255
+ enableWebGL: enableWebGL,
253
256
  baseLayer: baseLayer,
254
257
  mapLayer: activeLayers,
255
258
  showCluster: showCluster
package/lib/es/components/map/components/features/basics/Polyline.js CHANGED
@@ -44,18 +44,39 @@ var Polyline = function Polyline(_ref) {
44
44
  style: style
45
45
  });
46
46
  if (hasArrows) {
47
- // Create a patterned polyline
48
- var arrowLineStyle = new H.map.SpatialStyle(_objectSpread(_objectSpread({}, arrowStyle), {}, {
49
- lineWidth: 10,
50
- strokeColor: 'rgba(0, 0, 0, 0.8)',
51
- lineDash: [0, 3],
52
- lineDashOffset: 1.6,
53
- lineTailCap: 'arrow-tail',
54
- lineHeadCap: 'arrow-head'
55
- }));
56
- var routeArrows = new H.map.Polyline(geometry, {
57
- style: arrowLineStyle
58
- });
47
+ var routeArrows;
48
+ if (api.settings.enableWebGL) {
49
+ // Create a patterned polyline
50
+ var arrowLineStyle = new H.map.SpatialStyle(_objectSpread(_objectSpread({}, arrowStyle), {}, {
51
+ lineWidth: 10,
52
+ strokeColor: 'rgba(0, 0, 0, 0.8)',
53
+ lineDash: [0, 3],
54
+ lineDashOffset: 1.6,
55
+ lineTailCap: 'arrow-tail',
56
+ lineHeadCap: 'arrow-head'
57
+ }));
58
+ routeArrows = new H.map.Polyline(geometry, {
59
+ style: arrowLineStyle
60
+ });
61
+ } else {
62
+ // Non WebGL way - Create a patterned polyline
63
+ var defaultArrowStyle = {
64
+ lineWidth: 2,
65
+ fillColor: 'rgba(42, 55, 64, 1)',
66
+ strokeColor: 'rgba(0, 0, 0, 0.8)',
67
+ lineDash: [0, 4],
68
+ lineTailCap: 'arrow-tail',
69
+ lineHeadCap: 'arrow-head'
70
+ };
71
+ var _arrowLineStyle = new H.map.SpatialStyle({
72
+ lineWidth: 10,
73
+ strokeColor: 'rgba(255, 255, 255, 0)'
74
+ });
75
+ routeArrows = new H.map.Polyline(geometry, {
76
+ style: _arrowLineStyle,
77
+ arrows: defaultArrowStyle
78
+ });
79
+ }
59
80
 
60
81
  // create a group that represents the route line and contains
61
82
  // outline and the pattern
package/lib/es/components/map/components/features/layers/baselayers/useBaseLayer.js CHANGED
@@ -48,10 +48,12 @@ var useBaseLayer = function useBaseLayer(props) {
48
48
  (0, _react.useEffect)(function () {
49
49
  if (!baseLayer) {
50
50
  var additionalParametersWithLocale = _objectSpread(_objectSpread({}, additionalParameters), {}, {
51
- lg: (0, _localization.mapToLongLocale)(language)
51
+ lg: (0, _localization.mapToLongLocale)(language),
52
52
  // ppi: getPPI(),
53
- });
54
53
 
54
+ // need to be set for better performence of legacy map
55
+ engineType: isWebGL ? undefined : H.map.render.RenderEngine.EngineType.P2D
56
+ });
55
57
  var defaultLayers = api.platform.createDefaultLayers(additionalParametersWithLocale);
56
58
  var newBaseLayer = getDefaultBaseLayer(defaultLayers, mapType, isWebGL);
57
59
  api.map.setBaseLayer(newBaseLayer);
package/lib/es/components/map/components/features/settings/builtinSettings/MapTypeSettings.js CHANGED
@@ -127,7 +127,8 @@ var MapTypeSettings = function MapTypeSettings(props) {
127
127
  };
128
128
  MapTypeSettings.displayName = 'MapTypeSettings';
129
129
  MapTypeSettings.defaultProps = {
130
- onMapTypeChange: function onMapTypeChange() {}
130
+ onMapTypeChange: function onMapTypeChange() {},
131
+ enableNightMap: true
131
132
  };
132
133
  MapTypeSettings.propTypes = {
133
134
  mapType: _propTypes["default"].string,
package/lib/es/styles/design/divider.less ADDED
@@ -0,0 +1,90 @@
1
+ .divider-y {
2
+ > * ~ * {
3
+ border-bottom-width: 0;
4
+ border-color: var(--gray-light);
5
+ border-top-style: solid;
6
+ border-top-width: 1px;
7
+ }
8
+ }
9
+
10
+ .divider-x {
11
+ > * ~ * {
12
+ border-color: var(--gray-light);
13
+ border-left-style: solid;
14
+ border-left-width: 1px;
15
+ border-right-width: 0;
16
+ }
17
+ }
18
+
19
+ [class*="divider-y"] {
20
+ &> * ~ * {
21
+ border-bottom-width: 0 !important;
22
+ }
23
+
24
+ &.divider-style-solid > * ~ * { border-top-style: solid !important}
25
+ &.divider-style-dotted > * ~ * { border-top-style: dotted !important}
26
+ &.divider-style-dashed > * ~ * { border-top-style: dashed !important}
27
+ }
28
+
29
+ [class*="divider-x"] {
30
+ &> * ~ * {
31
+ border-right-width: 0;
32
+ }
33
+
34
+ &.divider-style-solid > * ~ * { border-left-style: solid !important}
35
+ &.divider-style-dotted > * ~ * { border-left-style: dotted !important}
36
+ &.divider-style-dashed > * ~ * { border-left-style: dashed !important}
37
+ }
38
+
39
+ .divider-y-1 {
40
+ &> * ~ * {
41
+ border-top-width: 1px !important;
42
+ }
43
+ }
44
+
45
+ .divider-y-2 > * ~ * {
46
+ border-top-width: 2px !important;
47
+ }
48
+
49
+ .divider-y-3 > * ~ * {
50
+ border-top-width: 3px !important;
51
+ }
52
+
53
+ .divider-x-1 {
54
+ &> * ~ * {
55
+ border-left-width: 1px !important;
56
+ }
57
+ }
58
+
59
+ .divider-x-2 > * ~ * {
60
+ border-left-width: 2px !important;
61
+ }
62
+
63
+ .divider-x-3 > * ~ * {
64
+ border-left-width: 3px !important;
65
+ }
66
+
67
+ // coloring
68
+
69
+ .divider-color {
70
+ // white
71
+ // black
72
+ each(@colors-text-map, {
73
+ &-@{key} > * ~ * {
74
+ border-color: @value !important;
75
+ }
76
+ })
77
+
78
+ // darkest
79
+ // darker
80
+ // dark
81
+ // gray
82
+ // light
83
+ // lighter
84
+ // lightest
85
+ each(@colors-gray-map, {
86
+ &-@{key} > * ~ * {
87
+ border-color: @value !important;
88
+ }
89
+ })
90
+ }
package/lib/es/styles/design/responsive/spacing.less CHANGED
@@ -1,11 +1,11 @@
1
1
  // spacing px
2
2
  each(@spacings-px, {
3
- .space-x-@{key}@{suffix} > :not([hidden]) ~ :not([hidden]) {
3
+ .space-x-@{key}@{suffix} > * ~ * {
4
4
  margin-left: @value !important;
5
5
  margin-right: 0 !important;
6
6
  }
7
7
 
8
- .space-y-@{key}@{suffix} > :not([hidden]) ~ :not([hidden]) {
8
+ .space-y-@{key}@{suffix} > * ~ * {
9
9
  margin-top: @value !important;
10
10
  margin-bottom: 0 !important;
11
11
  }
package/lib/es/styles/rio-uikit-core.less CHANGED
@@ -42,7 +42,7 @@
42
42
  @import (less) './design/aspect-ratio.less';
43
43
  @import (less) './design/colors.less';
44
44
  @import (less) './design/border.less';
45
- @import (less) './design/divide.less';
45
+ @import (less) './design/divider.less';
46
46
  @import (less) './design/cursors.less';
47
47
  @import (less) './design/custom.less';
48
48
  @import (less) './design/ellipsis.less';
package/lib/es/version.json CHANGED
@@ -1,3 +1,3 @@
1
1
  {
2
- "version": "0.16.2-beta.16"
2
+ "version": "0.16.2-beta.17"
3
3
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rio-cloud/rio-uikit",
3
- "version": "0.16.2-beta.16",
3
+ "version": "0.16.2-beta.17",
4
4
  "description": "The RIO UIKIT component library",
5
5
  "repository": "https://collaboration.msi.audi.com/stash/projects/RIOFRONT/repos/uikit-web/browse",
6
6
  "scripts": {
package/styles/design/divider.less ADDED
@@ -0,0 +1,90 @@
1
+ .divider-y {
2
+ > * ~ * {
3
+ border-bottom-width: 0;
4
+ border-color: var(--gray-light);
5
+ border-top-style: solid;
6
+ border-top-width: 1px;
7
+ }
8
+ }
9
+
10
+ .divider-x {
11
+ > * ~ * {
12
+ border-color: var(--gray-light);
13
+ border-left-style: solid;
14
+ border-left-width: 1px;
15
+ border-right-width: 0;
16
+ }
17
+ }
18
+
19
+ [class*="divider-y"] {
20
+ &> * ~ * {
21
+ border-bottom-width: 0 !important;
22
+ }
23
+
24
+ &.divider-style-solid > * ~ * { border-top-style: solid !important}
25
+ &.divider-style-dotted > * ~ * { border-top-style: dotted !important}
26
+ &.divider-style-dashed > * ~ * { border-top-style: dashed !important}
27
+ }
28
+
29
+ [class*="divider-x"] {
30
+ &> * ~ * {
31
+ border-right-width: 0;
32
+ }
33
+
34
+ &.divider-style-solid > * ~ * { border-left-style: solid !important}
35
+ &.divider-style-dotted > * ~ * { border-left-style: dotted !important}
36
+ &.divider-style-dashed > * ~ * { border-left-style: dashed !important}
37
+ }
38
+
39
+ .divider-y-1 {
40
+ &> * ~ * {
41
+ border-top-width: 1px !important;
42
+ }
43
+ }
44
+
45
+ .divider-y-2 > * ~ * {
46
+ border-top-width: 2px !important;
47
+ }
48
+
49
+ .divider-y-3 > * ~ * {
50
+ border-top-width: 3px !important;
51
+ }
52
+
53
+ .divider-x-1 {
54
+ &> * ~ * {
55
+ border-left-width: 1px !important;
56
+ }
57
+ }
58
+
59
+ .divider-x-2 > * ~ * {
60
+ border-left-width: 2px !important;
61
+ }
62
+
63
+ .divider-x-3 > * ~ * {
64
+ border-left-width: 3px !important;
65
+ }
66
+
67
+ // coloring
68
+
69
+ .divider-color {
70
+ // white
71
+ // black
72
+ each(@colors-text-map, {
73
+ &-@{key} > * ~ * {
74
+ border-color: @value !important;
75
+ }
76
+ })
77
+
78
+ // darkest
79
+ // darker
80
+ // dark
81
+ // gray
82
+ // light
83
+ // lighter
84
+ // lightest
85
+ each(@colors-gray-map, {
86
+ &-@{key} > * ~ * {
87
+ border-color: @value !important;
88
+ }
89
+ })
90
+ }
package/styles/design/responsive/spacing.less CHANGED
@@ -1,11 +1,11 @@
1
1
  // spacing px
2
2
  each(@spacings-px, {
3
- .space-x-@{key}@{suffix} > :not([hidden]) ~ :not([hidden]) {
3
+ .space-x-@{key}@{suffix} > * ~ * {
4
4
  margin-left: @value !important;
5
5
  margin-right: 0 !important;
6
6
  }
7
7
 
8
- .space-y-@{key}@{suffix} > :not([hidden]) ~ :not([hidden]) {
8
+ .space-y-@{key}@{suffix} > * ~ * {
9
9
  margin-top: @value !important;
10
10
  margin-bottom: 0 !important;
11
11
  }
package/styles/rio-uikit-core.less CHANGED
@@ -42,7 +42,7 @@
42
42
  @import (less) './design/aspect-ratio.less';
43
43
  @import (less) './design/colors.less';
44
44
  @import (less) './design/border.less';
45
- @import (less) './design/divide.less';
45
+ @import (less) './design/divider.less';
46
46
  @import (less) './design/cursors.less';
47
47
  @import (less) './design/custom.less';
48
48
  @import (less) './design/ellipsis.less';
package/version.json CHANGED
@@ -1,3 +1,3 @@
1
1
  {
2
- "version": "0.16.2-beta.16"
2
+ "version": "0.16.2-beta.17"
3
3
  }