@refinitiv-ui/elements 6.0.4 → 6.1.0

package/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [6.1.0](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@6.0.4...@refinitiv-ui/elements@6.1.0) (2022-08-16)
+
+
+### Bug Fixes
+
+* **datetime-picker:** parse invalid value to date object ([#422](https://github.com/Refinitiv/refinitiv-ui/issues/422)) ([dd86b73](https://github.com/Refinitiv/refinitiv-ui/commit/dd86b73fecd03518d2dae78174b91b0ef50fc913))
+* **overlay:** Tab does not work with slotted elements ([16f4b60](https://github.com/Refinitiv/refinitiv-ui/commit/16f4b60e9b840d3b7d225f3d61f15e017dc17855))
+* **radio-button:** check-changed is not fired on arrow keys ([77d7407](https://github.com/Refinitiv/refinitiv-ui/commit/77d7407883ba77e7b07bdaa8483fc49d35c76c14))
+
+
+### Features
+
+* **interactive-chart:** add disabledLegend option to hide data legend ([#421](https://github.com/Refinitiv/refinitiv-ui/issues/421)) ([32a6d7b](https://github.com/Refinitiv/refinitiv-ui/commit/32a6d7b1889597a7ae804edbb08fc95fc5c5a04e))
+
+
+
+
+
 ## [6.0.4](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@6.0.3...@refinitiv-ui/elements@6.0.4) (2022-08-02)
 
 

package/lib/datetime-picker/index.js

@@ -175,7 +175,7 @@ let DatetimePicker = class DatetimePicker extends ControlElement {
         cursor: pointer;
       }
       :host([popup-disabled]) [part=icon], :host([readonly]) [part=icon] {
-        pointer-event: none;
+        pointer-events: none;
       }
     `;
     }
@@ -841,12 +841,17 @@ let DatetimePicker = class DatetimePicker extends ControlElement {
      */
     isValueWithinMinMax() {
         if (this.min || this.max) {
-            const minTime = this.min ? parse(this.min).getTime() : -Infinity;
-            const maxTime = this.max ? parse(this.max).getTime() : Infinity;
             for (let i = 0; i < this.values.length; i += 1) {
-                const valueTime = parse(this.values[i]).getTime();
-                if (minTime > valueTime || maxTime < valueTime) {
-                    return false;
+                const value = this.values[i];
+                if (value) {
+                    // Value before min
+                    if (this.min && value !== this.min && isBefore(value, this.min)) {
+                        return false;
+                    }
+                    // Value after max
+                    if (this.max && value !== this.max && isAfter(value, this.max)) {
+                        return false;
+                    }
                 }
             }
         }

package/lib/interactive-chart/helpers/types.d.ts

@@ -38,6 +38,7 @@ interface InteractiveChartSeries {
     type: string;
     symbol?: string;
     symbolName?: string;
+    legendVisible?: boolean;
     legendPriceFormatter?: (price: string | number) => string | number;
     data: SeriesData;
     seriesOptions?: SeriesPartialOptions<SeriesOptions>;

package/lib/interactive-chart/index.js

@@ -12,7 +12,6 @@ import { LegendStyle } from './helpers/types.js';
 import { merge } from './helpers/merge.js';
 const NOT_AVAILABLE_DATA = 'N/A';
 const NO_DATA_POINT = '--';
-const HIDE_DATA_POINT = '';
 /**
  * A charting component that allows you to create several use cases of financial chart.
  * By lightweight-charts library.
@@ -633,11 +632,12 @@ let InteractiveChart = InteractiveChart_1 = class InteractiveChart extends Respo
             const chartType = this.internalConfig.series[idx].type;
             const dataSet = this.internalConfig.series[idx].data || [];
             const symbol = (this.internalConfig.series[idx].symbolName || this.internalConfig.series[idx].symbol) || '';
+            const isLegendVisible = this.internalConfig.series[idx].legendVisible !== false;
             // Create row legend element
             if (!rowLegend) {
                 rowLegendElem = document.createElement('div');
                 rowLegendElem.setAttribute('class', 'row');
-                this.createTextSymbol(rowLegendElem, symbol);
+                isLegendVisible && this.createTextSymbol(rowLegendElem, symbol);
                 if (dataSet.length) {
                     this.hasDataPoint = true;
                     const lastData = dataSet[dataSet.length - 1];
@@ -669,7 +669,7 @@ let InteractiveChart = InteractiveChart_1 = class InteractiveChart extends Respo
                 }
                 // when there's no data point in the series object.
                 else if (!eventMove?.seriesPrices.get(this.seriesList[idx]) && eventMove?.time) {
-                    value = symbol ? NO_DATA_POINT : HIDE_DATA_POINT;
+                    value = NO_DATA_POINT;
                     this.isCrosshairVisible = true;
                     this.hasDataPoint = false;
                 }
@@ -698,8 +698,9 @@ let InteractiveChart = InteractiveChart_1 = class InteractiveChart extends Respo
      * @returns {void}
      */
     renderTextLegend(chartType, rowLegendElem, value, priceColor, index) {
+        const isLegendVisible = this.internalConfig.series[index].legendVisible !== false;
         // No need to render if disable legend
-        if (this.disabledLegend) {
+        if (this.disabledLegend || !isLegendVisible) {
             return;
         }
         if (chartType === 'bar' || chartType === 'candlestick') {
@@ -764,7 +765,7 @@ let InteractiveChart = InteractiveChart_1 = class InteractiveChart extends Respo
                 /**
                  * Create a new span OHLC after displaying (--) or (N/A)
                  */
-                if (spanElem.textContent === NOT_AVAILABLE_DATA || spanElem.textContent === NO_DATA_POINT || spanElem.textContent === HIDE_DATA_POINT) {
+                if (spanElem.textContent === NOT_AVAILABLE_DATA || spanElem.textContent === NO_DATA_POINT) {
                     rowLegend[index].removeChild(spanElem);
                     this.createSpanOHLC(rowLegend[index], rowData, priceColor);
                 }
@@ -801,7 +802,7 @@ let InteractiveChart = InteractiveChart_1 = class InteractiveChart extends Respo
     createTextPrice(rowLegend, price, priceColor, index) {
         const formatter = this.internalConfig.series[index].legendPriceFormatter;
         // Formats legend only when formatter and data point are provided
-        const formattedPrice = !!formatter && price !== NO_DATA_POINT && price !== HIDE_DATA_POINT ? formatter(price) : price;
+        const formattedPrice = !!formatter && price !== NO_DATA_POINT ? formatter(price) : price;
         // Create text price after chart has rendered
         if (rowLegend instanceof HTMLElement) {
             rowLegend.setAttribute('data-color', priceColor);

package/lib/overlay/managers/focus-manager.js

@@ -126,13 +126,13 @@ export class FocusManager {
     }
     isFocusBoundaryDescendant(element) {
         const focusBoundaryElements = this.focusBoundaryElements;
-        let node = element.parentNode;
+        let node = element.assignedSlot || element.parentNode;
         while (node) {
             if ((node instanceof HTMLElement || node instanceof ShadowRoot) && focusBoundaryElements.includes(node)) {
                 return true;
             }
             // parenNode is not defined if the node is inside document fragment. Use host instead
-            node = node.nodeType === Node.DOCUMENT_FRAGMENT_NODE ? node.host : node.parentNode;
+            node = node.nodeType === Node.DOCUMENT_FRAGMENT_NODE ? node.host : (node.assignedSlot || node.parentNode);
         }
         return false;
     }

package/lib/radio-button/index.js

@@ -216,9 +216,9 @@ let RadioButton = class RadioButton extends ControlElement {
         if (!element) {
             element = direction === 'next' ? group[0] : group[group.length - 1];
         }
-        if (!element.readonly) {
-            this.checked = false;
+        if (!element.readonly && element !== this && !element.checked) {
             element.checked = true;
+            element.notifyPropertyChange('checked', element.checked);
         }
         element.focus();
     }

package/lib/version.js

@@ -1 +1 @@
-export const VERSION = '6.0.4';
+export const VERSION = '6.1.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinitiv-ui/elements",
-  "version": "6.0.4",
+  "version": "6.1.0",
   "description": "Element Framework Elements",
   "author": "Refinitiv",
   "license": "Apache-2.0",
@@ -338,24 +338,24 @@
     "tslib": "^2.3.1"
   },
   "devDependencies": {
-    "@refinitiv-ui/core": "^6.0.3",
-    "@refinitiv-ui/demo-block": "^6.0.4",
+    "@refinitiv-ui/core": "^6.0.4",
+    "@refinitiv-ui/demo-block": "^6.0.5",
     "@refinitiv-ui/i18n": "^6.0.3",
     "@refinitiv-ui/phrasebook": "^6.1.2",
     "@refinitiv-ui/test-helpers": "^6.0.3",
-    "@refinitiv-ui/translate": "^6.0.3",
+    "@refinitiv-ui/translate": "^6.0.4",
     "@refinitiv-ui/utils": "^6.0.3",
     "@types/d3-interpolate": "^3.0.1"
   },
   "peerDependencies": {
-    "@refinitiv-ui/core": "^6.0.3",
+    "@refinitiv-ui/core": "^6.0.4",
     "@refinitiv-ui/i18n": "^6.0.3",
     "@refinitiv-ui/phrasebook": "^6.1.2",
-    "@refinitiv-ui/translate": "^6.0.3",
+    "@refinitiv-ui/translate": "^6.0.4",
     "@refinitiv-ui/utils": "^6.0.3"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "489b81e6e87d65a6b44b5960a9a5da795518b4ce"
+  "gitHead": "155cbde4c14e5d365bd8af2daf3c4eea3e481b19"
 }