@refinitiv-ui/elements 7.7.0 → 7.8.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [7.8.0](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@7.7.0...@refinitiv-ui/elements@7.8.0) (2023-10-31)
+
+### Bug Fixes
+
+- **list:** `selectItem()` should always require a param ([#998](https://github.com/Refinitiv/refinitiv-ui/issues/998)) ([fef8e56](https://github.com/Refinitiv/refinitiv-ui/commit/fef8e56e9187f4b0a49962a4cd87defcdc02f103))
+- update `@trivago/prettier-plugin-sort-imports` to fix babel vulnerable to arbitrary code execution ([#1002](https://github.com/Refinitiv/refinitiv-ui/issues/1002)) ([e96385f](https://github.com/Refinitiv/refinitiv-ui/commit/e96385f652d8e2a8c3f6dffc952fecd718c9d033))
+
+### Features
+
+- adding `type=module` to `package.json` ([#974](https://github.com/Refinitiv/refinitiv-ui/issues/974)) ([9bf21dc](https://github.com/Refinitiv/refinitiv-ui/commit/9bf21dc05cb7ed93e1d14e797c1bf6af85b659d3)), closes [#985](https://github.com/Refinitiv/refinitiv-ui/issues/985)
+
 # [7.7.0](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@7.6.2...@refinitiv-ui/elements@7.7.0) (2023-10-24)
 
 ### Bug Fixes

package/lib/autosuggest/index.d.ts

@@ -6,9 +6,9 @@ import '../item/index.js';
 import '../loader/index.js';
 import { Overlay } from '../overlay/index.js';
 import { renderer } from './helpers/renderer.js';
-import { escapeRegExp, itemHighlightable, queryWordSelect } from './helpers/utils.js';
 import type { AutosuggestHighlightItemEvent, AutosuggestHighlightable, AutosuggestItem, AutosuggestMethodType, AutosuggestQuery, AutosuggestReason, AutosuggestRenderer, AutosuggestSelectItemEvent, AutosuggestTargetElement } from './helpers/types';
 import type { AddAttachTargetEventsEvent, ItemHighlightEvent, ItemSelectEvent, RemoveAttachTargetEventsEvent, SuggestionsChangedEvent, SuggestionsClearRequestedEvent, SuggestionsFetchRequestedEvent, SuggestionsQueryEvent } from './helpers/types';
+import { escapeRegExp, itemHighlightable, queryWordSelect } from './helpers/utils.js';
 export type { AutosuggestTargetElement, AutosuggestHighlightable, AutosuggestMethodType, AutosuggestQuery, AutosuggestRenderer, AutosuggestReason, AutosuggestItem, ItemHighlightEvent, AddAttachTargetEventsEvent, RemoveAttachTargetEventsEvent, ItemSelectEvent, SuggestionsFetchRequestedEvent, SuggestionsClearRequestedEvent, SuggestionsQueryEvent, SuggestionsChangedEvent };
 export { updateElementContent } from './helpers/utils.js';
 export { itemHighlightable, escapeRegExp, queryWordSelect, renderer, renderer as itemRenderer };

package/lib/chart/elements/chart.d.ts

@@ -1,11 +1,11 @@
 import { JSXInterface } from '../../jsx';
 import { Chart as ChartJS } from 'chart.js';
+import type { ChartConfiguration, ChartDataset, ChartOptions, ChartType, LegendItem, UpdateMode } from 'chart.js';
 import 'chartjs-adapter-date-fns';
 import { BasicElement, CSSResultGroup, PropertyValues, TemplateResult, nothing } from '@refinitiv-ui/core';
 import { Ref } from '@refinitiv-ui/core/directives/ref.js';
 import '../../header/index.js';
 import { DatasetColors } from '../helpers/index.js';
-import type { ChartConfiguration, ChartDataset, ChartOptions, ChartType, LegendItem, UpdateMode } from 'chart.js';
 declare module 'chart.js' {
     interface PluginOptionsByType<TType extends ChartType = ChartType> {
         'ef-chart': object;

package/lib/combo-box/helpers/filter.d.ts

@@ -1,7 +1,7 @@
+import type { DataItem } from '@refinitiv-ui/utils/collection.js';
 import type { ItemData } from '../../item';
 import type { ComboBox } from '../index';
 import type { ComboBoxFilter } from './types';
-import type { DataItem } from '@refinitiv-ui/utils/collection.js';
 /**
  * Default filter used by combo box
  * @param el ComboBox instance to filter

package/lib/combo-box/helpers/types.d.ts

@@ -1,5 +1,5 @@
-import type { ItemData } from '../../item';
 import type { DataItem } from '@refinitiv-ui/utils/collection.js';
+import type { ItemData } from '../../item';
 /**
  * Predicate callback
  * Matches item against filter function

package/lib/combo-box/index.d.ts

@@ -7,12 +7,12 @@ import { AnimationTaskRunner } from '@refinitiv-ui/utils/async.js';
 import { CollectionComposer, DataItem } from '@refinitiv-ui/utils/collection.js';
 import '../counter/index.js';
 import '../icon/index.js';
+import type { ItemData } from '../item';
+import type { List } from '../list';
 import '../list/index.js';
 import '../overlay/index.js';
 import { CustomKeyboardEvent } from './helpers/keyboard-event.js';
 import { ComboBoxRenderer } from './helpers/renderer.js';
-import type { ItemData } from '../item';
-import type { List } from '../list';
 import type { ComboBoxData, ComboBoxFilter } from './helpers/types';
 export type { ComboBoxFilter, ComboBoxData };
 export { ComboBoxRenderer };

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

@@ -1,5 +1,5 @@
-import type { HSLColor, RGBColor } from '@refinitiv-ui/utils/color.js';
 import type { ChartOptions, DeepPartial, ISeriesApi, SeriesDataItemTypeMap, SeriesOptionsMap, SeriesType } from 'lightweight-charts';
+import type { HSLColor, RGBColor } from '@refinitiv-ui/utils/color.js';
 type UnionToIntersection<U> = (U extends unknown ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
 type SeriesOptions = UnionToIntersection<SeriesOptionsMap[keyof SeriesOptionsMap]>;
 type SeriesList = ISeriesApi<SeriesType>;

package/lib/interactive-chart/index.d.ts

@@ -1,8 +1,8 @@
 import { JSXInterface } from '../jsx';
+import type { IChartApi, MouseEventParams } from 'lightweight-charts';
 import { CSSResultGroup, ElementSize, PropertyValues, ResponsiveElement, TemplateResult } from '@refinitiv-ui/core';
 import '../tooltip/index.js';
 import type { InteractiveChartConfig, InteractiveChartSeries, LegendStyle, RowLegend, SeriesDataItem, SeriesList, SeriesOptions, Theme } from './helpers/types.js';
-import type { IChartApi, MouseEventParams } from 'lightweight-charts';
 export type { InteractiveChartConfig, InteractiveChartSeries, Theme, SeriesOptions, SeriesDataItem };
 /**
  * A charting component that allows you to create several use cases of financial chart.

package/lib/list/custom-elements.md

@@ -16,14 +16,14 @@ Provides listing and immutable selection
 
 ## Methods
 
-| Method         | Type                                 | Description                                      |
-|----------------|--------------------------------------|--------------------------------------------------|
-| `down`         | `(): void`                           | Navigate down through the list items             |
-| `first`        | `(): void`                           | Navigate to first focusable item of the list     |
-| `last`         | `(): void`                           | Navigate to first focusable item of the list     |
-| `scrollToItem` | `(item: T): void`                    | Scroll to list item element<br /><br />**item**: Data item to scroll to |
-| `selectItem`   | `(item?: T \| HTMLElement): boolean` | Selects an item in the list<br /><br />**item**: Data Item or Item Element |
-| `up`           | `(): void`                           | Navigate up through the list items               |
+| Method         | Type                                | Description                                      |
+|----------------|-------------------------------------|--------------------------------------------------|
+| `down`         | `(): void`                          | Navigate down through the list items             |
+| `first`        | `(): void`                          | Navigate to first focusable item of the list     |
+| `last`         | `(): void`                          | Navigate to first focusable item of the list     |
+| `scrollToItem` | `(item: T): void`                   | Scroll to list item element<br /><br />**item**: Data item to scroll to |
+| `selectItem`   | `(item: T \| HTMLElement): boolean` | Selects an item in the list<br /><br />**item**: Data Item or Item Element |
+| `up`           | `(): void`                          | Navigate up through the list items               |
 
 ## Events
 

package/lib/list/elements/list.d.ts

@@ -1,10 +1,10 @@
 import { JSXInterface } from '../../jsx';
 import { CSSResultGroup, ControlElement, PropertyValues, TapEvent, TemplateResult, WarningNotice } from '@refinitiv-ui/core';
 import { CollectionComposer, DataItem } from '@refinitiv-ui/utils/collection.js';
-import { ListRenderer } from '../helpers/renderer.js';
-import './list-item.js';
 import type { ItemData } from '../../item';
+import { ListRenderer } from '../helpers/renderer.js';
 import type { ListData } from '../helpers/types';
+import './list-item.js';
 /**
  * Key direction
  */
@@ -93,7 +93,7 @@ export declare class List<T extends DataItem = ItemData> extends ControlElement
      * @param {T | HTMLElement} item Data Item or Item Element
      * @returns If a selection has been made or not
      */
-    selectItem(item?: T | HTMLElement): boolean;
+    selectItem(item: T | HTMLElement): boolean;
     /**
      * Navigate up through the list items
      * @returns {void}

package/lib/list/elements/list.js

@@ -164,21 +164,28 @@ let List = class List extends ControlElement {
      * @returns If a selection has been made or not
      */
     selectItem(item) {
-        if (!this.stateless) {
-            if (item instanceof HTMLElement) {
-                item = this.itemFromElement(item);
-            }
-            if (item && this.multiple) {
-                const value = this.composer.getItemPropertyValue(item, 'selected');
-                this.composer.setItemPropertyValue(item, 'selected', !value);
-                return true;
+        if (this.stateless) {
+            return false;
+        }
+        if (item instanceof HTMLElement) {
+            const itemFromElement = this.itemFromElement(item);
+            if (itemFromElement) {
+                item = itemFromElement;
             }
-            if (item && this.composer.getItemPropertyValue(item, 'selected') !== true) {
-                this.clearSelection();
-                this.composer.setItemPropertyValue(item, 'selected', true);
-                return true;
+            else {
+                return false;
             }
         }
+        if (this.multiple) {
+            const value = this.composer.getItemPropertyValue(item, 'selected');
+            this.composer.setItemPropertyValue(item, 'selected', !value);
+            return true;
+        }
+        if (this.composer.getItemPropertyValue(item, 'selected') !== true) {
+            this.clearSelection();
+            this.composer.setItemPropertyValue(item, 'selected', true);
+            return true;
+        }
         return false;
     }
     /**

package/lib/list/helpers/types.d.ts

@@ -1,3 +1,3 @@
-import type { ItemData } from '../../item';
 import type { CollectionComposer, DataItem } from '@refinitiv-ui/utils/collection.js';
+import type { ItemData } from '../../item';
 export type ListData<T extends DataItem = ItemData> = T[] | CollectionComposer<T> | null;

package/lib/list/renderer.d.ts

@@ -1,5 +1,5 @@
-import { ExtensibleFunction } from './extensible-function.js';
 import type { CollectionComposer, DataItem } from '@refinitiv-ui/utils/collection.js';
+import { ExtensibleFunction } from './extensible-function.js';
 /**
  * Render function interface
  * TODO: Move this to @refinitiv-ui/utils

package/lib/overlay/managers/backdrop-manager.d.ts

@@ -1,5 +1,5 @@
-import '../elements/overlay-backdrop.js';
 import type { Overlay } from '../elements/overlay';
+import '../elements/overlay-backdrop.js';
 /**
  * Backdrop manager adds a backdrop to the body
  * @returns {void}

package/lib/overlay/managers/viewport-manager.d.ts

@@ -1,5 +1,5 @@
-import '../elements/overlay-viewport.js';
 import type { Overlay } from '../elements/overlay';
+import '../elements/overlay-viewport.js';
 import type { ViewAreaInfo } from '../helpers/types';
 /**
  * Viewport manager singleton is responsible for getting

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

@@ -95,6 +95,7 @@ export class ViewportManager {
         // Safari does but zooming doesn't update this property value
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
+        // TODO: Remove @ts-ignore and re-test again when standardized zoom is implemented across major browsers and TypeScript, https://github.com/w3c/csswg-drafts/issues/5623
         // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         const zoom = parseFloat(window.getComputedStyle(document.body).zoom);
         const screenHeight = screenRect.height / zoom;

package/lib/overlay-menu/helpers/types.d.ts

@@ -1,6 +1,6 @@
+import type { CollectionComposer } from '@refinitiv-ui/utils/collection.js';
 import type { Item, ItemData } from '../../item';
 import type { OverlayMenu } from '../index';
-import type { CollectionComposer } from '@refinitiv-ui/utils/collection.js';
 export type NestedMenu = {
     menu: OverlayMenu;
     item: Item;

package/lib/overlay-menu/managers/menu-manager.d.ts

@@ -1,5 +1,5 @@
-import { OverlayMenu } from '../index.js';
 import type { Item } from '../../item';
+import { OverlayMenu } from '../index.js';
 /**
  * Overlay menu manager monitors menu nesting and ensures
  * that only a single menu tree can be opened

package/lib/sidebar-layout/index.d.ts

@@ -1,7 +1,7 @@
 import { JSXInterface } from '../jsx';
 import { BasicElement, CSSResultGroup, PropertyValues, TemplateResult } from '@refinitiv-ui/core';
-import '../layout/index.js';
 import type { Layout } from '../layout';
+import '../layout/index.js';
 /**
  * Provides an app layout with sidebar.
  * There are 4 sections that can be slotted a component in.

package/lib/tooltip/index.d.ts

@@ -1,10 +1,10 @@
 import { JSXInterface } from '../jsx';
 import { BasicElement, CSSResultGroup, PropertyValues, TemplateResult } from '@refinitiv-ui/core';
+import type { OverlayTransitionStyle as TooltipTransitionStyle } from '../overlay';
 import '../overlay/index.js';
 import './elements/title-tooltip.js';
 import { deregister as deregisterOverflowTooltip, register as registerOverflowTooltip } from './helpers/overflow-tooltip.js';
 import { TooltipCondition, TooltipPosition, TooltipRenderer } from './helpers/types.js';
-import type { OverlayTransitionStyle as TooltipTransitionStyle } from '../overlay';
 /**
  * Tooltip displays extra information when the
  * user hovers the pointer over an item.

package/lib/tree/elements/tree-item.d.ts

@@ -2,8 +2,8 @@ import { JSXInterface } from '../../jsx';
 import { ControlElement, PropertyValues, TemplateResult } from '@refinitiv-ui/core';
 import '../../checkbox/index.js';
 import '../../icon/index.js';
-import { CheckedState } from '../managers/tree-manager.js';
 import type { TreeDataItem } from '../helpers/types';
+import { CheckedState } from '../managers/tree-manager.js';
 /**
  * Displays a tree list item.
  * Groups display expansion arrows.

package/lib/tree/elements/tree.d.ts

@@ -3,9 +3,9 @@ import { PropertyValues, TapEvent } from '@refinitiv-ui/core';
 import { CollectionComposer } from '@refinitiv-ui/utils/collection.js';
 import { List } from '../../list/index.js';
 import { TreeRenderer } from '../helpers/renderer.js';
+import type { TreeData, TreeDataItem, TreeFilter } from '../helpers/types';
 import { TreeManagerMode } from '../managers/tree-manager.js';
 import './tree-item.js';
-import type { TreeData, TreeDataItem, TreeFilter } from '../helpers/types';
 /**
  * Displays a tree structure
  * to be used for menus and group selections

package/lib/tree/managers/tree-manager.d.ts

@@ -1,5 +1,5 @@
-import type { TreeDataItem } from '../helpers/types';
 import type { CollectionComposer } from '@refinitiv-ui/utils/collection.js';
+import type { TreeDataItem } from '../helpers/types';
 export declare enum CheckedState {
     CHECKED = 1,
     UNCHECKED = 0,

package/lib/tree-select/index.d.ts

@@ -7,14 +7,14 @@ import { CollectionComposer } from '@refinitiv-ui/utils/collection.js';
 import '../button/index.js';
 import '../checkbox/index.js';
 import { ComboBox, ComboBoxFilter as TreeSelectFilter } from '../combo-box/index.js';
+import type { CheckChangedEvent } from '../events';
 import '../icon/index.js';
+import type { Overlay } from '../overlay';
 import '../pill/index.js';
 import '../tree/index.js';
 import { TreeRenderer as TreeSelectRenderer } from '../tree/index.js';
-import { TreeManager, TreeManagerMode } from '../tree/managers/tree-manager.js';
-import type { CheckChangedEvent } from '../events';
-import type { Overlay } from '../overlay';
 import type { Tree } from '../tree/index.js';
+import { TreeManager, TreeManagerMode } from '../tree/managers/tree-manager.js';
 import type { TreeSelectData, TreeSelectDataItem } from './helpers/types';
 export { TreeSelectRenderer };
 export type { TreeSelectFilter, TreeSelectDataItem, TreeSelectData };

package/lib/version.js

@@ -1 +1 @@
-export const VERSION = '7.7.0';
+export const VERSION = '7.8.0';

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@refinitiv-ui/elements",
-  "version": "7.7.0",
+  "version": "7.8.0",
   "description": "Element Framework Elements",
   "author": "LSEG",
   "license": "Apache-2.0",
   "main": "./lib/index.js",
   "module": "./lib/index.js",
+  "type": "module",
   "types": "./lib/index.d.ts",
   "homepage": "https://ui.refinitiv.com",
   "repository": {
@@ -325,24 +326,24 @@
     "./tree-select/themes/solar/pearl": "./lib/tree-select/themes/solar/pearl/index.js"
   },
   "scripts": {
-    "build": "node cli.mjs build --sourceMap --declarationMap",
-    "build:prod": "node cli.mjs build",
+    "build": "node cli.js build --sourceMap --declarationMap",
+    "build:prod": "node cli.js build",
     "clean": "nx exec -- rm -rf lib tsconfig.tsbuildinfo",
-    "start": "node cli.mjs start",
-    "test": "node cli.mjs test",
-    "test:watch": "node cli.mjs test --watch",
-    "test:snapshots": "node cli.mjs test --update-snapshots",
-    "lint": "node cli.mjs lint",
-    "lint:fix": "node cli.mjs lint --fix",
-    "prepublishOnly": "node scripts/release/index.mjs",
+    "start": "node cli.js start",
+    "test": "node cli.js test",
+    "test:watch": "node cli.js test --watch",
+    "test:snapshots": "node cli.js test --update-snapshots",
+    "lint": "node cli.js lint",
+    "lint:fix": "node cli.js lint --fix",
+    "prepublishOnly": "node scripts/release/index.js",
     "api-analyzer": "node ../../scripts/release/api-analyzer.cjs",
     "prepack": "npm run version",
-    "version": "node ../../scripts/version/index.mjs"
+    "version": "node ../../scripts/version/index.js"
   },
   "dependencies": {
     "@lit-labs/context": "^0.3.1",
-    "@refinitiv-ui/halo-theme": "^7.1.1",
-    "@refinitiv-ui/solar-theme": "^7.1.1",
+    "@refinitiv-ui/halo-theme": "^7.2.0",
+    "@refinitiv-ui/solar-theme": "^7.2.0",
     "chart.js": "^4.3.0",
     "chartjs-adapter-date-fns": "^3.0.0",
     "d3-interpolate": "^3.0.1",
@@ -351,25 +352,25 @@
     "tslib": "^2.3.1"
   },
   "devDependencies": {
-    "@refinitiv-ui/core": "^7.2.2",
-    "@refinitiv-ui/demo-block": "^7.0.9",
-    "@refinitiv-ui/i18n": "^7.0.5",
-    "@refinitiv-ui/phrasebook": "^7.0.5",
-    "@refinitiv-ui/test-helpers": "^7.0.4",
-    "@refinitiv-ui/translate": "^7.0.6",
-    "@refinitiv-ui/utils": "^7.1.2",
+    "@refinitiv-ui/core": "^7.3.0",
+    "@refinitiv-ui/demo-block": "^7.1.0",
+    "@refinitiv-ui/i18n": "^7.1.0",
+    "@refinitiv-ui/phrasebook": "^7.1.0",
+    "@refinitiv-ui/test-helpers": "^7.1.0",
+    "@refinitiv-ui/translate": "^7.1.0",
+    "@refinitiv-ui/utils": "^7.2.0",
     "@types/d3-interpolate": "^3.0.1"
   },
   "peerDependencies": {
     "@refinitiv-ui/browser-sparkline": "^1.0.0 || ^2.0.0",
-    "@refinitiv-ui/core": "^7.2.2",
-    "@refinitiv-ui/i18n": "^7.0.5",
-    "@refinitiv-ui/phrasebook": "^7.0.5",
-    "@refinitiv-ui/translate": "^7.0.6",
-    "@refinitiv-ui/utils": "^7.1.2"
+    "@refinitiv-ui/core": "^7.3.0",
+    "@refinitiv-ui/i18n": "^7.1.0",
+    "@refinitiv-ui/phrasebook": "^7.1.0",
+    "@refinitiv-ui/translate": "^7.1.0",
+    "@refinitiv-ui/utils": "^7.2.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3844f684f73a3ef5f035dd567e4362add74825eb"
+  "gitHead": "f0019ccc2f241a998c5e455b433c0e36720d5fe6"
 }

package/cli.mjs

@@ -1,23 +0,0 @@
-#!/usr/bin/env node
-import { hideBin } from 'yargs/helpers';
-import yargs from 'yargs/yargs';
-
-import { commands } from './scripts/cmd/index.mjs';
-import { errorHandler, info } from './scripts/helpers/index.mjs';
-
-yargs(hideBin(process.argv))
-  .usage('Element Framework CLI Commands\n\nUsage: $0 <command> [options]')
-  .command(commands)
-  .demandCommand(1, 'You need at least one command.')
-  .version(false)
-  .help('help')
-  .alias('help', 'h')
-  .fail(function (msg, err, yargs) {
-    if (msg) {
-      errorHandler(msg);
-    }
-
-    info('\nSpecify --help for available options.\n');
-    process.exit(1);
-  })
-  .parse();