@refinitiv-ui/elements 6.18.6 → 6.20.0
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.
- package/CHANGELOG.md +16 -0
- package/lib/collapse/index.js +0 -2
- package/lib/datetime-picker/custom-elements.json +13 -0
- package/lib/datetime-picker/custom-elements.md +29 -28
- package/lib/datetime-picker/index.d.ts +5 -0
- package/lib/datetime-picker/index.js +11 -2
- package/lib/flag/index.js +1 -1
- package/lib/icon/index.d.ts +36 -3
- package/lib/icon/index.js +88 -25
- package/lib/icon/themes/halo/dark/index.js +1 -1
- package/lib/icon/themes/halo/light/index.js +1 -1
- package/lib/icon/themes/solar/charcoal/index.js +1 -1
- package/lib/icon/themes/solar/pearl/index.js +1 -1
- package/lib/icon/utils/SpriteLoader.d.ts +23 -0
- package/lib/icon/utils/SpriteLoader.js +42 -0
- package/lib/password-field/index.js +0 -6
- package/lib/tooltip/index.d.ts +0 -5
- package/lib/tooltip/index.js +7 -14
- package/lib/tooltip/managers/tooltip-manager.js +16 -0
- package/lib/tree/elements/tree-item.js +0 -2
- package/lib/version.js +1 -1
- package/package.json +14 -14
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,22 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [6.20.0](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@6.19.0...@refinitiv-ui/elements@6.20.0) (2025-04-28)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **tooltip:** fix tooltip reopen when mouse leaves ([#1279](https://github.com/Refinitiv/refinitiv-ui/issues/1279)) ([6eb3ff3](https://github.com/Refinitiv/refinitiv-ui/commit/6eb3ff3bd92ab5f6c3b37be49519805cd39b1dc7))
|
|
11
|
+
|
|
12
|
+
### Features
|
|
13
|
+
|
|
14
|
+
- **datetime-picker:** introduce preventCloseOnSelect to prevents the Picker from closing on date selection ([#1278](https://github.com/Refinitiv/refinitiv-ui/issues/1278)) ([4d937e7](https://github.com/Refinitiv/refinitiv-ui/commit/4d937e77fad7b89a56952d4a937da56451002fc5))
|
|
15
|
+
|
|
16
|
+
# [6.19.0](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@6.18.6...@refinitiv-ui/elements@6.19.0) (2025-04-23)
|
|
17
|
+
|
|
18
|
+
### Features
|
|
19
|
+
|
|
20
|
+
- **icon:** add icon sprites ([#1274](https://github.com/Refinitiv/refinitiv-ui/issues/1274)) ([be7f5d7](https://github.com/Refinitiv/refinitiv-ui/commit/be7f5d71b5e0c071eee08c01c9bfc1c9cb146f53))
|
|
21
|
+
|
|
6
22
|
## [6.18.6](https://github.com/Refinitiv/refinitiv-ui/compare/@refinitiv-ui/elements@6.18.5...@refinitiv-ui/elements@6.18.6) (2024-11-14)
|
|
7
23
|
|
|
8
24
|
**Note:** Version bump only for package @refinitiv-ui/elements
|
package/lib/collapse/index.js
CHANGED
|
@@ -5,11 +5,9 @@ import { property } from '@refinitiv-ui/core/decorators/property.js';
|
|
|
5
5
|
import { state } from '@refinitiv-ui/core/decorators/state.js';
|
|
6
6
|
import { createRef, ref } from '@refinitiv-ui/core/directives/ref.js';
|
|
7
7
|
import '../header/index.js';
|
|
8
|
-
import { preload } from '../icon/index.js';
|
|
9
8
|
import '../icon/index.js';
|
|
10
9
|
import '../panel/index.js';
|
|
11
10
|
import { VERSION } from '../version.js';
|
|
12
|
-
preload('right'); /* preload calendar icons for faster loading */
|
|
13
11
|
/**
|
|
14
12
|
* Allows users to hide non-critical information
|
|
15
13
|
* or areas of the screen, maximizing the amount of real estate
|
|
@@ -76,6 +76,12 @@
|
|
|
76
76
|
"type": "boolean",
|
|
77
77
|
"default": "false"
|
|
78
78
|
},
|
|
79
|
+
{
|
|
80
|
+
"name": "prevent-close-on-select",
|
|
81
|
+
"description": "Prevents the Picker from closing on date selection.\nNote that if timepicker is true, the picker will remain open regardless of this flag.",
|
|
82
|
+
"type": "boolean",
|
|
83
|
+
"default": "false"
|
|
84
|
+
},
|
|
79
85
|
{
|
|
80
86
|
"name": "input-disabled",
|
|
81
87
|
"description": "Disable input part of the picker",
|
|
@@ -237,6 +243,13 @@
|
|
|
237
243
|
"type": "boolean",
|
|
238
244
|
"default": "false"
|
|
239
245
|
},
|
|
246
|
+
{
|
|
247
|
+
"name": "preventCloseOnSelect",
|
|
248
|
+
"attribute": "prevent-close-on-select",
|
|
249
|
+
"description": "Prevents the Picker from closing on date selection.\nNote that if timepicker is true, the picker will remain open regardless of this flag.",
|
|
250
|
+
"type": "boolean",
|
|
251
|
+
"default": "false"
|
|
252
|
+
},
|
|
240
253
|
{
|
|
241
254
|
"name": "inputDisabled",
|
|
242
255
|
"attribute": "input-disabled",
|
|
@@ -4,34 +4,35 @@ Control to pick date and time
|
|
|
4
4
|
|
|
5
5
|
## Properties
|
|
6
6
|
|
|
7
|
-
| Property | Attribute
|
|
8
|
-
|
|
9
|
-
| `amPm` | `am-pm`
|
|
10
|
-
| `clears` | `clears`
|
|
11
|
-
| `disabled` | `disabled`
|
|
12
|
-
| `duplex` | `duplex`
|
|
13
|
-
| `error` | `error`
|
|
14
|
-
| `filter` |
|
|
15
|
-
| `firstDayOfWeek` | `first-day-of-week`
|
|
16
|
-
| `format` | `format`
|
|
17
|
-
| `inputDisabled` | `input-disabled`
|
|
18
|
-
| `inputTriggerDisabled` | `input-trigger-disabled`
|
|
19
|
-
| `max` | `max`
|
|
20
|
-
| `min` | `min`
|
|
21
|
-
| `opened` | `opened`
|
|
22
|
-
| `placeholder` | `placeholder`
|
|
23
|
-
| `popupDisabled` | `popup-disabled`
|
|
24
|
-
| `
|
|
25
|
-
| `
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
28
|
-
| `
|
|
29
|
-
| `
|
|
30
|
-
| `
|
|
31
|
-
| `
|
|
32
|
-
| `
|
|
33
|
-
| `
|
|
34
|
-
| `
|
|
7
|
+
| Property | Attribute | Type | Default | Description |
|
|
8
|
+
|------------------------|---------------------------|----------------------------------|---------------|--------------------------------------------------|
|
|
9
|
+
| `amPm` | `am-pm` | `boolean` | false | Toggles 12hr time display |
|
|
10
|
+
| `clears` | `clears` | `boolean` | false | Show clears button |
|
|
11
|
+
| `disabled` | `disabled` | `boolean` | false | Set disabled state |
|
|
12
|
+
| `duplex` | `duplex` | `"" \| "consecutive" \| "split"` | null | Display two calendar pickers. |
|
|
13
|
+
| `error` | `error` | `boolean` | false | Set error state |
|
|
14
|
+
| `filter` | | `DatetimePickerFilter \| null` | null | Custom filter, used for enabling/disabling certain dates |
|
|
15
|
+
| `firstDayOfWeek` | `first-day-of-week` | `number \| undefined` | | Set the first day of the week.<br />0 - for Sunday, 6 - for Saturday |
|
|
16
|
+
| `format` | `format` | `string` | "dd-MMM-yyyy" | Set the datetime format<br />Based on date-fns formats (https://date-fns.org/) |
|
|
17
|
+
| `inputDisabled` | `input-disabled` | `boolean` | false | Disable input part of the picker |
|
|
18
|
+
| `inputTriggerDisabled` | `input-trigger-disabled` | `boolean` | false | Only open picker panel when calendar icon is clicked.<br />Clicking on the input will no longer open the picker. |
|
|
19
|
+
| `max` | `max` | `string` | "" | Set maximum date |
|
|
20
|
+
| `min` | `min` | `string` | "" | Set minimum date |
|
|
21
|
+
| `opened` | `opened` | `boolean` | false | Toggles the opened state of the list |
|
|
22
|
+
| `placeholder` | `placeholder` | `string` | "dd-MMM-yyyy" | Set placeholder text default depends on format |
|
|
23
|
+
| `popupDisabled` | `popup-disabled` | `boolean` | false | Disable the popup |
|
|
24
|
+
| `preventCloseOnSelect` | `prevent-close-on-select` | `boolean` | false | Prevents the Picker from closing on date selection.<br />Note that if timepicker is true, the picker will remain open regardless of this flag. |
|
|
25
|
+
| `range` | `range` | `boolean` | false | Set to switch to range select mode |
|
|
26
|
+
| `readonly` | `readonly` | `boolean` | false | Set readonly state |
|
|
27
|
+
| `showSeconds` | `show-seconds` | `boolean` | false | Flag to show seconds time segment in display.<br />Seconds are automatically shown when `hh:mm:ss` time format is provided as a value. |
|
|
28
|
+
| `timepicker` | `timepicker` | `boolean` | false | Toggle to display the time picker |
|
|
29
|
+
| `value` | `value` | `string` | "" | Current date time value |
|
|
30
|
+
| `values` | `values` | `string[]` | [] | Set multiple selected values |
|
|
31
|
+
| `view` | `view` | `string` | "" | Set the current calendar view.<br />Accepted format: 'yyyy-MM' |
|
|
32
|
+
| `views` | | `string[]` | [] | Set the current calendar views for duplex mode<br />Accepted format: 'yyyy-MM' |
|
|
33
|
+
| `warning` | `warning` | `boolean` | false | Set warning state |
|
|
34
|
+
| `weekdaysOnly` | `weekdays-only` | `boolean` | false | Only enable weekdays |
|
|
35
|
+
| `weekendsOnly` | `weekends-only` | `boolean` | false | Only enable weekends |
|
|
35
36
|
|
|
36
37
|
## Methods
|
|
37
38
|
|
|
@@ -154,6 +154,11 @@ export declare class DatetimePicker extends FormFieldElement implements MultiVal
|
|
|
154
154
|
* Clicking on the input will no longer open the picker.
|
|
155
155
|
*/
|
|
156
156
|
inputTriggerDisabled: boolean;
|
|
157
|
+
/**
|
|
158
|
+
* Prevents the Picker from closing on date selection.
|
|
159
|
+
* Note that if timepicker is true, the picker will remain open regardless of this flag.
|
|
160
|
+
*/
|
|
161
|
+
preventCloseOnSelect: boolean;
|
|
157
162
|
/**
|
|
158
163
|
* Disable input part of the picker
|
|
159
164
|
*/
|
|
@@ -11,7 +11,6 @@ import { TranslatePropertyKey, getLocale, translate } from '@refinitiv-ui/transl
|
|
|
11
11
|
import { DateFormat, DateTimeFormat, addMonths, format, isAfter, isBefore, isValidDate, isValidDateTime, isWeekend, parse, subMonths } from '@refinitiv-ui/utils/date.js';
|
|
12
12
|
import '../calendar/index.js';
|
|
13
13
|
import '../icon/index.js';
|
|
14
|
-
import { preload } from '../icon/index.js';
|
|
15
14
|
import '../overlay/index.js';
|
|
16
15
|
import '../text-field/index.js';
|
|
17
16
|
import '../time-picker/index.js';
|
|
@@ -19,7 +18,6 @@ import { VERSION } from '../version.js';
|
|
|
19
18
|
import { CALENDAR_FROM_ID, CALENDAR_ID, CALENDAR_TO_ID, INPUT_FORMAT, INPUT_FROM_ID, INPUT_ID, INPUT_TO_ID, POPUP_POSITION, TIMEPICKER_FROM_ID, TIMEPICKER_ID, TIMEPICKER_TO_ID, TRANSLATION_KEYS } from './constants.js';
|
|
20
19
|
import { getDateFNSLocale } from './locales.js';
|
|
21
20
|
import { DateTimeSegment, formatToView, getCurrentTime } from './utils.js';
|
|
22
|
-
preload('calendar', 'down', 'left', 'right'); /* preload calendar icons for faster loading */
|
|
23
21
|
/**
|
|
24
22
|
* Control to pick date and time
|
|
25
23
|
*
|
|
@@ -106,6 +104,11 @@ let DatetimePicker = class DatetimePicker extends FormFieldElement {
|
|
|
106
104
|
* Clicking on the input will no longer open the picker.
|
|
107
105
|
*/
|
|
108
106
|
this.inputTriggerDisabled = false;
|
|
107
|
+
/**
|
|
108
|
+
* Prevents the Picker from closing on date selection.
|
|
109
|
+
* Note that if timepicker is true, the picker will remain open regardless of this flag.
|
|
110
|
+
*/
|
|
111
|
+
this.preventCloseOnSelect = false;
|
|
109
112
|
/**
|
|
110
113
|
* Disable input part of the picker
|
|
111
114
|
*/
|
|
@@ -796,6 +799,9 @@ let DatetimePicker = class DatetimePicker extends FormFieldElement {
|
|
|
796
799
|
// Close popup if there is no time picker
|
|
797
800
|
const newValues = this.values;
|
|
798
801
|
if (!this.timepicker && newValues[0] && (this.range ? newValues[1] : true)) {
|
|
802
|
+
if (this.preventCloseOnSelect) {
|
|
803
|
+
return;
|
|
804
|
+
}
|
|
799
805
|
this.setOpened(false);
|
|
800
806
|
/**
|
|
801
807
|
* Custom cell selection delegates focus back to the text field when the overlay is closed,
|
|
@@ -1281,6 +1287,9 @@ __decorate([
|
|
|
1281
1287
|
__decorate([
|
|
1282
1288
|
property({ type: Boolean, attribute: 'input-trigger-disabled' })
|
|
1283
1289
|
], DatetimePicker.prototype, "inputTriggerDisabled", void 0);
|
|
1290
|
+
__decorate([
|
|
1291
|
+
property({ type: Boolean, attribute: 'prevent-close-on-select' })
|
|
1292
|
+
], DatetimePicker.prototype, "preventCloseOnSelect", void 0);
|
|
1284
1293
|
__decorate([
|
|
1285
1294
|
property({ type: Boolean, attribute: 'input-disabled', reflect: true })
|
|
1286
1295
|
], DatetimePicker.prototype, "inputDisabled", void 0);
|
package/lib/flag/index.js
CHANGED
|
@@ -15,7 +15,7 @@ let Flag = class Flag extends BasicElement {
|
|
|
15
15
|
* Deprecation notice displays a warning message
|
|
16
16
|
* when deprecated features are used.
|
|
17
17
|
*/
|
|
18
|
-
this.deprecationNotice = new DeprecationNotice('`src` attribute and property are deprecated. Use `flag`
|
|
18
|
+
this.deprecationNotice = new DeprecationNotice('`src` attribute and property are deprecated. Use `flag` attribute and property instead.');
|
|
19
19
|
this._src = null;
|
|
20
20
|
this._template = EmptyTemplate;
|
|
21
21
|
}
|
package/lib/icon/index.d.ts
CHANGED
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
import { JSXInterface } from '../jsx';
|
|
2
|
-
import { BasicElement, CSSResultGroup, PropertyValues, TemplateResult } from '@refinitiv-ui/core';
|
|
2
|
+
import { BasicElement, CSSResultGroup, PropertyValues, SVGTemplateResult, TemplateResult } from '@refinitiv-ui/core';
|
|
3
3
|
import type { Config } from '../configuration/index.js';
|
|
4
|
+
export { IconLoader } from './utils/IconLoader.js';
|
|
5
|
+
export { SpriteLoader } from './utils/SpriteLoader.js';
|
|
4
6
|
export { preload } from './utils/IconLoader.js';
|
|
7
|
+
/**
|
|
8
|
+
* Cache for reusing SVG template results across multiple icons.
|
|
9
|
+
* Reusing these templates increases performance dramatically when many icons are rendered.
|
|
10
|
+
* As the cache key is an absolute URL, we can assume no clashes will occur.
|
|
11
|
+
*/
|
|
12
|
+
export declare const iconTemplateCache: Map<string, Promise<SVGTemplateResult>>;
|
|
5
13
|
export declare class Icon extends BasicElement {
|
|
6
14
|
/**
|
|
7
15
|
* Element version number
|
|
@@ -53,6 +61,13 @@ export declare class Icon extends BasicElement {
|
|
|
53
61
|
*/
|
|
54
62
|
private get template();
|
|
55
63
|
private set template(value);
|
|
64
|
+
/**
|
|
65
|
+
* A deferred promise representing icon ready.
|
|
66
|
+
* It would be resolved when the icon svg has been fetched and parsed, or
|
|
67
|
+
* when the icon svg is unavailable/invalid.
|
|
68
|
+
*/
|
|
69
|
+
private iconReady;
|
|
70
|
+
constructor();
|
|
56
71
|
/**
|
|
57
72
|
* Check if the icon map configuration has content
|
|
58
73
|
* @returns icon map if exists
|
|
@@ -64,11 +79,22 @@ export declare class Icon extends BasicElement {
|
|
|
64
79
|
* @returns {void}
|
|
65
80
|
*/
|
|
66
81
|
protected firstUpdated(changedProperties: PropertyValues): void;
|
|
82
|
+
protected getUpdateComplete(): Promise<boolean>;
|
|
67
83
|
/**
|
|
68
|
-
*
|
|
84
|
+
* instantiate a new deferred promise for icon ready if it's not pending already
|
|
69
85
|
* @returns {void}
|
|
70
86
|
*/
|
|
71
|
-
private
|
|
87
|
+
private deferIconReady;
|
|
88
|
+
/**
|
|
89
|
+
* Check if the icon is valid to render
|
|
90
|
+
* @returns false if icon value or icon map value is invalid
|
|
91
|
+
*/
|
|
92
|
+
private isIconValid;
|
|
93
|
+
/**
|
|
94
|
+
* Update the icon renderer
|
|
95
|
+
* @returns {void}
|
|
96
|
+
*/
|
|
97
|
+
private updateRenderer;
|
|
72
98
|
/**
|
|
73
99
|
* Tries to load an icon from the url provided
|
|
74
100
|
* and the renders this into the icon template.
|
|
@@ -76,6 +102,13 @@ export declare class Icon extends BasicElement {
|
|
|
76
102
|
* @returns {void}
|
|
77
103
|
*/
|
|
78
104
|
private loadAndRenderIcon;
|
|
105
|
+
/**
|
|
106
|
+
* Tries to load get an icon from the sprite url provided
|
|
107
|
+
* and the renders this into the icon template.
|
|
108
|
+
* @param iconName Name of the svg icon.
|
|
109
|
+
* @returns {void}
|
|
110
|
+
*/
|
|
111
|
+
private loadAndRenderSpriteIcon;
|
|
79
112
|
/**
|
|
80
113
|
* Get and cache CDN prefix
|
|
81
114
|
* This is a private URL which is set in the theme
|
package/lib/icon/index.js
CHANGED
|
@@ -4,9 +4,13 @@ import { BasicElement, DeprecationNotice, css, svg } from '@refinitiv-ui/core';
|
|
|
4
4
|
import { customElement } from '@refinitiv-ui/core/decorators/custom-element.js';
|
|
5
5
|
import { property } from '@refinitiv-ui/core/decorators/property.js';
|
|
6
6
|
import { unsafeSVG } from '@refinitiv-ui/core/directives/unsafe-svg.js';
|
|
7
|
+
import { Deferred, isBase64svg, isUrl } from '@refinitiv-ui/utils/loader.js';
|
|
7
8
|
import { efConfig } from '../configuration/index.js';
|
|
8
9
|
import { VERSION } from '../version.js';
|
|
9
10
|
import { IconLoader } from './utils/IconLoader.js';
|
|
11
|
+
import { SpriteLoader } from './utils/SpriteLoader.js';
|
|
12
|
+
export { IconLoader } from './utils/IconLoader.js';
|
|
13
|
+
export { SpriteLoader } from './utils/SpriteLoader.js';
|
|
10
14
|
export { preload } from './utils/IconLoader.js';
|
|
11
15
|
const EmptyTemplate = svg ``;
|
|
12
16
|
/**
|
|
@@ -14,19 +18,8 @@ const EmptyTemplate = svg ``;
|
|
|
14
18
|
* Reusing these templates increases performance dramatically when many icons are rendered.
|
|
15
19
|
* As the cache key is an absolute URL, we can assume no clashes will occur.
|
|
16
20
|
*/
|
|
17
|
-
const iconTemplateCache = new Map();
|
|
21
|
+
export const iconTemplateCache = new Map();
|
|
18
22
|
let Icon = class Icon extends BasicElement {
|
|
19
|
-
constructor() {
|
|
20
|
-
super(...arguments);
|
|
21
|
-
this._icon = null;
|
|
22
|
-
/**
|
|
23
|
-
* Deprecation notice displays a warning message
|
|
24
|
-
* when deprecated features are used.
|
|
25
|
-
*/
|
|
26
|
-
this.deprecationNotice = new DeprecationNotice('`src` attribute and property are deprecated. Use `icon` for attribute and property instead.');
|
|
27
|
-
this._src = null;
|
|
28
|
-
this._template = EmptyTemplate;
|
|
29
|
-
}
|
|
30
23
|
/**
|
|
31
24
|
* Element version number
|
|
32
25
|
* @returns version number
|
|
@@ -65,8 +58,9 @@ let Icon = class Icon extends BasicElement {
|
|
|
65
58
|
set icon(value) {
|
|
66
59
|
const oldValue = this._icon;
|
|
67
60
|
if (oldValue !== value) {
|
|
61
|
+
this.deferIconReady();
|
|
68
62
|
this._icon = value;
|
|
69
|
-
|
|
63
|
+
requestAnimationFrame(() => this.updateRenderer());
|
|
70
64
|
this.requestUpdate('icon', oldValue);
|
|
71
65
|
}
|
|
72
66
|
}
|
|
@@ -87,13 +81,7 @@ let Icon = class Icon extends BasicElement {
|
|
|
87
81
|
set src(value) {
|
|
88
82
|
if (this.src !== value) {
|
|
89
83
|
this._src = value;
|
|
90
|
-
this.
|
|
91
|
-
if (this.icon && this.iconMap) {
|
|
92
|
-
void this.loadAndRenderIcon(this.iconMap);
|
|
93
|
-
}
|
|
94
|
-
else if (value) {
|
|
95
|
-
void this.loadAndRenderIcon(value);
|
|
96
|
-
}
|
|
84
|
+
this.icon = value;
|
|
97
85
|
}
|
|
98
86
|
if (value && !this.icon) {
|
|
99
87
|
this.deprecationNotice.once();
|
|
@@ -110,6 +98,22 @@ let Icon = class Icon extends BasicElement {
|
|
|
110
98
|
this._template = value;
|
|
111
99
|
this.requestUpdate();
|
|
112
100
|
}
|
|
101
|
+
this.iconReady.resolve();
|
|
102
|
+
}
|
|
103
|
+
constructor() {
|
|
104
|
+
super();
|
|
105
|
+
this._icon = null;
|
|
106
|
+
/**
|
|
107
|
+
* Deprecation notice displays a warning message
|
|
108
|
+
* when deprecated features are used.
|
|
109
|
+
*/
|
|
110
|
+
this.deprecationNotice = new DeprecationNotice('`src` attribute and property are deprecated. Use `icon` attribute and property instead.');
|
|
111
|
+
this._src = null;
|
|
112
|
+
this._template = EmptyTemplate;
|
|
113
|
+
this.iconReady = new Deferred();
|
|
114
|
+
// `iconReady` resolves at this stage so that `updateComplete` would be resolvable
|
|
115
|
+
// even in the case that `icon` attribute is missing.
|
|
116
|
+
this.iconReady.resolve();
|
|
113
117
|
}
|
|
114
118
|
/**
|
|
115
119
|
* Check if the icon map configuration has content
|
|
@@ -131,12 +135,52 @@ let Icon = class Icon extends BasicElement {
|
|
|
131
135
|
*/
|
|
132
136
|
this.setPrefix();
|
|
133
137
|
}
|
|
138
|
+
async getUpdateComplete() {
|
|
139
|
+
const result = await super.getUpdateComplete();
|
|
140
|
+
await this.iconReady.promise;
|
|
141
|
+
return result;
|
|
142
|
+
}
|
|
143
|
+
/**
|
|
144
|
+
* instantiate a new deferred promise for icon ready if it's not pending already
|
|
145
|
+
* @returns {void}
|
|
146
|
+
*/
|
|
147
|
+
deferIconReady() {
|
|
148
|
+
if (this.iconReady.isPending()) {
|
|
149
|
+
return;
|
|
150
|
+
}
|
|
151
|
+
this.iconReady = new Deferred();
|
|
152
|
+
}
|
|
134
153
|
/**
|
|
135
|
-
*
|
|
154
|
+
* Check if the icon is valid to render
|
|
155
|
+
* @returns false if icon value or icon map value is invalid
|
|
156
|
+
*/
|
|
157
|
+
isIconValid() {
|
|
158
|
+
if (!this._icon) {
|
|
159
|
+
return false;
|
|
160
|
+
}
|
|
161
|
+
if (this.iconMap && !isBase64svg(this.iconMap) && !isUrl(this.iconMap)) {
|
|
162
|
+
return false;
|
|
163
|
+
}
|
|
164
|
+
return true;
|
|
165
|
+
}
|
|
166
|
+
/**
|
|
167
|
+
* Update the icon renderer
|
|
136
168
|
* @returns {void}
|
|
137
169
|
*/
|
|
138
|
-
|
|
139
|
-
|
|
170
|
+
updateRenderer() {
|
|
171
|
+
if (!this.isIconValid()) {
|
|
172
|
+
return this.clearIcon();
|
|
173
|
+
}
|
|
174
|
+
const iconProperty = this._icon;
|
|
175
|
+
if (this.iconMap) {
|
|
176
|
+
void this.loadAndRenderIcon(this.iconMap);
|
|
177
|
+
}
|
|
178
|
+
else if (isUrl(iconProperty) || IconLoader.isPrefixResolved) {
|
|
179
|
+
void this.loadAndRenderIcon(iconProperty);
|
|
180
|
+
}
|
|
181
|
+
else {
|
|
182
|
+
void this.loadAndRenderSpriteIcon(iconProperty);
|
|
183
|
+
}
|
|
140
184
|
}
|
|
141
185
|
/**
|
|
142
186
|
* Tries to load an icon from the url provided
|
|
@@ -152,6 +196,20 @@ let Icon = class Icon extends BasicElement {
|
|
|
152
196
|
}
|
|
153
197
|
this.template = await iconTemplateCacheItem;
|
|
154
198
|
}
|
|
199
|
+
/**
|
|
200
|
+
* Tries to load get an icon from the sprite url provided
|
|
201
|
+
* and the renders this into the icon template.
|
|
202
|
+
* @param iconName Name of the svg icon.
|
|
203
|
+
* @returns {void}
|
|
204
|
+
*/
|
|
205
|
+
async loadAndRenderSpriteIcon(iconName) {
|
|
206
|
+
const iconTemplateCacheItem = iconTemplateCache.get(iconName);
|
|
207
|
+
if (!iconTemplateCacheItem) {
|
|
208
|
+
iconTemplateCache.set(iconName, SpriteLoader.loadSpriteSVG(iconName).then((body) => svg `${unsafeSVG(body)}`));
|
|
209
|
+
return this.loadAndRenderIcon(iconName); // Load again and await cache result
|
|
210
|
+
}
|
|
211
|
+
this.template = await iconTemplateCacheItem;
|
|
212
|
+
}
|
|
155
213
|
/**
|
|
156
214
|
* Get and cache CDN prefix
|
|
157
215
|
* This is a private URL which is set in the theme
|
|
@@ -159,10 +217,15 @@ let Icon = class Icon extends BasicElement {
|
|
|
159
217
|
* @returns {void}
|
|
160
218
|
*/
|
|
161
219
|
setPrefix() {
|
|
162
|
-
|
|
163
|
-
|
|
220
|
+
// This prefix for individual icons allows supporting custom prefix of self-managed icons.
|
|
221
|
+
if (IconLoader.isPrefixPending) {
|
|
222
|
+
const CDNPrefix = this.getComputedVariable('--cdn-prefix');
|
|
164
223
|
IconLoader.setCdnPrefix(CDNPrefix);
|
|
165
224
|
}
|
|
225
|
+
if (SpriteLoader.isPrefixPending) {
|
|
226
|
+
const CDNSpritePrefix = this.getComputedVariable('--cdn-sprite-prefix');
|
|
227
|
+
SpriteLoader.setCdnPrefix(CDNSpritePrefix);
|
|
228
|
+
}
|
|
166
229
|
}
|
|
167
230
|
/**
|
|
168
231
|
* Clears SVG body from the icon template
|
|
@@ -1 +1 @@
|
|
|
1
|
-
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/icons
|
|
1
|
+
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';font-size:16px}:host svg{pointer-events:none}:host circle[fill]:not([fill=none]),:host ellipse[fill]:not([fill=none]),:host g[fill]:not([fill=none]),:host line[fill]:not([fill=none]),:host path[fill]:not([fill=none]),:host polygon[fill]:not([fill=none]),:host polyline[fill]:not([fill=none]),:host rect[fill]:not([fill=none]){fill:currentColor}:host circle[stroke]:not([stroke=none]),:host ellipse[stroke]:not([stroke=none]),:host g[stroke]:not([stroke=none]),:host line[stroke]:not([stroke=none]),:host path[stroke]:not([stroke=none]),:host polygon[stroke]:not([stroke=none]),:host polyline[stroke]:not([stroke=none]),:host rect[stroke]:not([stroke=none]){stroke:currentColor}:host([icon=powerpoint]){color:#ff3535}:host([icon=excel]){color:#00a626}:host([icon=pdf]){color:#ff3535}:host([icon=word]){color:#0094c4}:host([icon=twitter]){color:#1da1f2}:host([focused=visible]){outline:#334bff solid 1px}:host([icon]) circle,:host([icon]) ellipse,:host([icon]) g,:host([icon]) line,:host([icon]) path,:host([icon]) polygon,:host([icon]) polyline,:host([icon]) rect{vector-effect:non-scaling-stroke}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host([icon]) circle,:host([icon]) ellipse,:host([icon]) g,:host([icon]) line,:host([icon]) path,:host([icon]) polygon,:host([icon]) polyline,:host([icon]) rect{vector-effect:none;stroke-width:calc(16px/.01em)}}' }}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/icons
|
|
1
|
+
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';font-size:16px}:host svg{pointer-events:none}:host circle[fill]:not([fill=none]),:host ellipse[fill]:not([fill=none]),:host g[fill]:not([fill=none]),:host line[fill]:not([fill=none]),:host path[fill]:not([fill=none]),:host polygon[fill]:not([fill=none]),:host polyline[fill]:not([fill=none]),:host rect[fill]:not([fill=none]){fill:currentColor}:host circle[stroke]:not([stroke=none]),:host ellipse[stroke]:not([stroke=none]),:host g[stroke]:not([stroke=none]),:host line[stroke]:not([stroke=none]),:host path[stroke]:not([stroke=none]),:host polygon[stroke]:not([stroke=none]),:host polyline[stroke]:not([stroke=none]),:host rect[stroke]:not([stroke=none]){stroke:currentColor}:host([icon=powerpoint]){color:#ff3535}:host([icon=excel]){color:#00a626}:host([icon=pdf]){color:#ff3535}:host([icon=word]){color:#0094c4}:host([icon=twitter]){color:#1da1f2}:host([focused=visible]){outline:#334bff solid 1px}:host([icon]) circle,:host([icon]) ellipse,:host([icon]) g,:host([icon]) line,:host([icon]) path,:host([icon]) polygon,:host([icon]) polyline,:host([icon]) rect{vector-effect:non-scaling-stroke}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host([icon]) circle,:host([icon]) ellipse,:host([icon]) g,:host([icon]) line,:host([icon]) path,:host([icon]) polygon,:host([icon]) polyline,:host([icon]) rect{vector-effect:none;stroke-width:calc(16px/.01em)}}' }}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/icons
|
|
1
|
+
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-solar/resources/sprites/icons.svg\'}:host svg{pointer-events:none}:host circle[fill]:not([fill=none]),:host ellipse[fill]:not([fill=none]),:host g[fill]:not([fill=none]),:host line[fill]:not([fill=none]),:host path[fill]:not([fill=none]),:host polygon[fill]:not([fill=none]),:host polyline[fill]:not([fill=none]),:host rect[fill]:not([fill=none]){fill:currentColor}:host circle[stroke]:not([stroke=none]),:host ellipse[stroke]:not([stroke=none]),:host g[stroke]:not([stroke=none]),:host line[stroke]:not([stroke=none]),:host path[stroke]:not([stroke=none]),:host polygon[stroke]:not([stroke=none]),:host polyline[stroke]:not([stroke=none]),:host rect[stroke]:not([stroke=none]){stroke:currentColor}:host([icon=powerpoint]){color:#ff3535}:host([icon=excel]){color:#00a626}:host([icon=pdf]){color:#ff3535}:host([icon=word]){color:#0094c4}:host([icon=twitter]){color:#1da1f2}:host([focused=visible]){outline:#f93 solid 1px}' }}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/icons
|
|
1
|
+
dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-icon', styles: ':host{--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-halo/resources/sprites/icons.svg\';--cdn-sprite-prefix:\'https://cdn.refinitiv.net/public/libs/elf/assets/elf-theme-solar/resources/sprites/icons.svg\'}:host svg{pointer-events:none}:host circle[fill]:not([fill=none]),:host ellipse[fill]:not([fill=none]),:host g[fill]:not([fill=none]),:host line[fill]:not([fill=none]),:host path[fill]:not([fill=none]),:host polygon[fill]:not([fill=none]),:host polyline[fill]:not([fill=none]),:host rect[fill]:not([fill=none]){fill:currentColor}:host circle[stroke]:not([stroke=none]),:host ellipse[stroke]:not([stroke=none]),:host g[stroke]:not([stroke=none]),:host line[stroke]:not([stroke=none]),:host path[stroke]:not([stroke=none]),:host polygon[stroke]:not([stroke=none]),:host polyline[stroke]:not([stroke=none]),:host rect[stroke]:not([stroke=none]){stroke:currentColor}:host([icon=powerpoint]){color:#ff3535}:host([icon=excel]){color:#00a626}:host([icon=pdf]){color:#ff3535}:host([icon=word]){color:#0094c4}:host([icon=twitter]){color:#1da1f2}:host([focused=visible]){outline:#ffb266 solid 1px}' }}));
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { SVGLoader } from '@refinitiv-ui/utils/loader.js';
|
|
2
|
+
/**
|
|
3
|
+
* Caches and provides sprite icon SVG
|
|
4
|
+
* Uses singleton pattern
|
|
5
|
+
*/
|
|
6
|
+
declare class SpriteLoader extends SVGLoader {
|
|
7
|
+
getSrc(): Promise<string>;
|
|
8
|
+
/**
|
|
9
|
+
* Load and Create DOM sprite SVG
|
|
10
|
+
* @returns returns the DOM sprite SVG
|
|
11
|
+
*/
|
|
12
|
+
private loadSprite;
|
|
13
|
+
/**
|
|
14
|
+
* Load and cache the DOM sprite svg
|
|
15
|
+
* Get an svg fragment of DOM sprite svg
|
|
16
|
+
* @param iconName Name of svg to load
|
|
17
|
+
* @returns returns the svg fragment body
|
|
18
|
+
*/
|
|
19
|
+
loadSpriteSVG(iconName: string): Promise<string | undefined>;
|
|
20
|
+
reset(): void;
|
|
21
|
+
}
|
|
22
|
+
declare const instance: SpriteLoader;
|
|
23
|
+
export { instance as SpriteLoader };
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { SVGLoader } from '@refinitiv-ui/utils/loader.js';
|
|
2
|
+
let spriteCache;
|
|
3
|
+
/**
|
|
4
|
+
* Caches and provides sprite icon SVG
|
|
5
|
+
* Uses singleton pattern
|
|
6
|
+
*/
|
|
7
|
+
class SpriteLoader extends SVGLoader {
|
|
8
|
+
async getSrc() {
|
|
9
|
+
return await this.getCdnPrefix();
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Load and Create DOM sprite SVG
|
|
13
|
+
* @returns returns the DOM sprite SVG
|
|
14
|
+
*/
|
|
15
|
+
async loadSprite() {
|
|
16
|
+
const sprite = await this.loadSVG('sprite/icons');
|
|
17
|
+
if (!sprite) {
|
|
18
|
+
throw new Error("SpriteLoader: couldn't load SVG sprite source");
|
|
19
|
+
}
|
|
20
|
+
return new DOMParser().parseFromString(sprite, 'image/svg+xml');
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Load and cache the DOM sprite svg
|
|
24
|
+
* Get an svg fragment of DOM sprite svg
|
|
25
|
+
* @param iconName Name of svg to load
|
|
26
|
+
* @returns returns the svg fragment body
|
|
27
|
+
*/
|
|
28
|
+
async loadSpriteSVG(iconName) {
|
|
29
|
+
if (!spriteCache) {
|
|
30
|
+
spriteCache = this.loadSprite();
|
|
31
|
+
}
|
|
32
|
+
const sprite = await spriteCache;
|
|
33
|
+
const icon = sprite.getElementById(iconName);
|
|
34
|
+
return icon ? icon.outerHTML : undefined;
|
|
35
|
+
}
|
|
36
|
+
reset() {
|
|
37
|
+
super.reset();
|
|
38
|
+
spriteCache = undefined;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
const instance = new SpriteLoader();
|
|
42
|
+
export { instance as SpriteLoader };
|
|
@@ -5,11 +5,9 @@ import { state } from '@refinitiv-ui/core/decorators/state.js';
|
|
|
5
5
|
import '@refinitiv-ui/phrasebook/locale/en/password-field.js';
|
|
6
6
|
import { translate } from '@refinitiv-ui/translate';
|
|
7
7
|
import { VISUALLY_HIDDEN_STYLE } from '@refinitiv-ui/utils/accessibility.js';
|
|
8
|
-
import { preload } from '../icon/index.js';
|
|
9
8
|
import '../icon/index.js';
|
|
10
9
|
import { TextField } from '../text-field/index.js';
|
|
11
10
|
import { deregisterOverflowTooltip } from '../tooltip/index.js';
|
|
12
|
-
let isEyeOffPreloadRequested = false;
|
|
13
11
|
/**
|
|
14
12
|
* A form control element for password.
|
|
15
13
|
*
|
|
@@ -75,10 +73,6 @@ let PasswordField = class PasswordField extends TextField {
|
|
|
75
73
|
*/
|
|
76
74
|
firstUpdated(changedProperties) {
|
|
77
75
|
super.firstUpdated(changedProperties);
|
|
78
|
-
if (!isEyeOffPreloadRequested) {
|
|
79
|
-
preload('eye-off');
|
|
80
|
-
isEyeOffPreloadRequested = true;
|
|
81
|
-
}
|
|
82
76
|
// password shouldn't display value on tooltip when value is overflow
|
|
83
77
|
deregisterOverflowTooltip(this);
|
|
84
78
|
}
|
package/lib/tooltip/index.d.ts
CHANGED
|
@@ -156,11 +156,6 @@ declare class Tooltip extends BasicElement {
|
|
|
156
156
|
* Hide tooltip
|
|
157
157
|
* @returns {void}
|
|
158
158
|
*/
|
|
159
|
-
private hideTooltip;
|
|
160
|
-
/**
|
|
161
|
-
* Reset tooltip
|
|
162
|
-
* @returns {void}
|
|
163
|
-
*/
|
|
164
159
|
private resetTooltip;
|
|
165
160
|
/**
|
|
166
161
|
* Run when mouse is moving over the document
|
package/lib/tooltip/index.js
CHANGED
|
@@ -63,11 +63,15 @@ let Tooltip = Tooltip_1 = class Tooltip extends BasicElement {
|
|
|
63
63
|
window.clearTimeout(this.timerTimeout);
|
|
64
64
|
};
|
|
65
65
|
/**
|
|
66
|
-
*
|
|
66
|
+
* Hide tooltip
|
|
67
67
|
* @returns {void}
|
|
68
68
|
*/
|
|
69
69
|
this.resetTooltip = () => {
|
|
70
|
-
this.
|
|
70
|
+
this.reset();
|
|
71
|
+
this.matchTarget = null;
|
|
72
|
+
this.matchTargetRect = null;
|
|
73
|
+
this.positionTarget = null;
|
|
74
|
+
this.setOpened(false);
|
|
71
75
|
};
|
|
72
76
|
/**
|
|
73
77
|
* Run when mouse is moving over the document
|
|
@@ -84,7 +88,7 @@ let Tooltip = Tooltip_1 = class Tooltip extends BasicElement {
|
|
|
84
88
|
*/
|
|
85
89
|
this.onClick = () => {
|
|
86
90
|
this.clicked = true;
|
|
87
|
-
this.
|
|
91
|
+
this.resetTooltip();
|
|
88
92
|
};
|
|
89
93
|
/**
|
|
90
94
|
* Run when document mouse out event happens
|
|
@@ -328,17 +332,6 @@ let Tooltip = Tooltip_1 = class Tooltip extends BasicElement {
|
|
|
328
332
|
}
|
|
329
333
|
this.appendChild(contentNode);
|
|
330
334
|
}
|
|
331
|
-
/**
|
|
332
|
-
* Hide tooltip
|
|
333
|
-
* @returns {void}
|
|
334
|
-
*/
|
|
335
|
-
hideTooltip() {
|
|
336
|
-
this.reset();
|
|
337
|
-
this.matchTarget = null;
|
|
338
|
-
this.matchTargetRect = null;
|
|
339
|
-
this.positionTarget = null;
|
|
340
|
-
this.setOpened(false);
|
|
341
|
-
}
|
|
342
335
|
/**
|
|
343
336
|
* Try to show the tooltip if it matches the target
|
|
344
337
|
* @param paths The paths leading to target
|
|
@@ -29,6 +29,7 @@ class TooltipManager {
|
|
|
29
29
|
* @returns {void}
|
|
30
30
|
*/
|
|
31
31
|
this.onClick = (event) => {
|
|
32
|
+
this.cancelThrottler();
|
|
32
33
|
this.registry.forEach(({ click }) => click(event));
|
|
33
34
|
};
|
|
34
35
|
/**
|
|
@@ -36,6 +37,7 @@ class TooltipManager {
|
|
|
36
37
|
* @returns {void}
|
|
37
38
|
*/
|
|
38
39
|
this.onMouseOut = (event) => {
|
|
40
|
+
this.cancelThrottler();
|
|
39
41
|
this.registry.forEach(({ mouseout }) => mouseout(event));
|
|
40
42
|
};
|
|
41
43
|
/**
|
|
@@ -43,6 +45,7 @@ class TooltipManager {
|
|
|
43
45
|
* @returns {void}
|
|
44
46
|
*/
|
|
45
47
|
this.onMouseLeave = (event) => {
|
|
48
|
+
this.cancelThrottler();
|
|
46
49
|
this.registry.forEach(({ mouseleave }) => mouseleave(event));
|
|
47
50
|
};
|
|
48
51
|
/**
|
|
@@ -50,6 +53,7 @@ class TooltipManager {
|
|
|
50
53
|
* @returns {void}
|
|
51
54
|
*/
|
|
52
55
|
this.onWheel = (event) => {
|
|
56
|
+
this.cancelThrottler();
|
|
53
57
|
this.registry.forEach(({ wheel }) => wheel(event));
|
|
54
58
|
};
|
|
55
59
|
/**
|
|
@@ -57,6 +61,7 @@ class TooltipManager {
|
|
|
57
61
|
* @returns {void}
|
|
58
62
|
*/
|
|
59
63
|
this.onKeyDown = (event) => {
|
|
64
|
+
this.cancelThrottler();
|
|
60
65
|
this.registry.forEach(({ keydown }) => keydown(event));
|
|
61
66
|
};
|
|
62
67
|
/**
|
|
@@ -64,6 +69,7 @@ class TooltipManager {
|
|
|
64
69
|
* @returns {void}
|
|
65
70
|
*/
|
|
66
71
|
this.onBlur = (event) => {
|
|
72
|
+
this.cancelThrottler();
|
|
67
73
|
this.registry.forEach(({ blur }) => blur(event));
|
|
68
74
|
};
|
|
69
75
|
}
|
|
@@ -89,6 +95,16 @@ class TooltipManager {
|
|
|
89
95
|
}
|
|
90
96
|
}
|
|
91
97
|
}
|
|
98
|
+
/**
|
|
99
|
+
* Cancel the pending task of throttled mousemove event listener.
|
|
100
|
+
* This prevents the task from running out of order compared to the event dispatching sequence
|
|
101
|
+
* due to its setTimeout usage.
|
|
102
|
+
* Any event listener hiding the tooltip should call this method.
|
|
103
|
+
* @returns {void}
|
|
104
|
+
*/
|
|
105
|
+
cancelThrottler() {
|
|
106
|
+
this.titleThrottler.task?.cancel();
|
|
107
|
+
}
|
|
92
108
|
register(tooltip, documentCallbacks) {
|
|
93
109
|
if (!this.registry.size) {
|
|
94
110
|
// IE11 does not support event options
|
|
@@ -4,10 +4,8 @@ import { customElement } from '@refinitiv-ui/core/decorators/custom-element.js';
|
|
|
4
4
|
import { property } from '@refinitiv-ui/core/decorators/property.js';
|
|
5
5
|
import '../../checkbox/index.js';
|
|
6
6
|
import '../../icon/index.js';
|
|
7
|
-
import { preload } from '../../icon/index.js';
|
|
8
7
|
import { VERSION } from '../../version.js';
|
|
9
8
|
import { CheckedState } from '../managers/tree-manager.js';
|
|
10
|
-
preload('right');
|
|
11
9
|
const emptyTemplate = html ``;
|
|
12
10
|
/**
|
|
13
11
|
* Displays a tree list item.
|
package/lib/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export const VERSION = '6.
|
|
1
|
+
export const VERSION = '6.20.0';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@refinitiv-ui/elements",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.20.0",
|
|
4
4
|
"description": "Element Framework Elements",
|
|
5
5
|
"author": "LSEG",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -339,8 +339,8 @@
|
|
|
339
339
|
},
|
|
340
340
|
"dependencies": {
|
|
341
341
|
"@lit-labs/context": "^0.3.1",
|
|
342
|
-
"@refinitiv-ui/halo-theme": "^6.
|
|
343
|
-
"@refinitiv-ui/solar-theme": "^6.
|
|
342
|
+
"@refinitiv-ui/halo-theme": "^6.10.0",
|
|
343
|
+
"@refinitiv-ui/solar-theme": "^6.6.0",
|
|
344
344
|
"@types/chart.js": "^2.9.31",
|
|
345
345
|
"chart.js": "~2.9.4",
|
|
346
346
|
"d3-interpolate": "^3.0.1",
|
|
@@ -350,25 +350,25 @@
|
|
|
350
350
|
"tslib": "^2.3.1"
|
|
351
351
|
},
|
|
352
352
|
"devDependencies": {
|
|
353
|
-
"@refinitiv-ui/core": "^6.6.
|
|
354
|
-
"@refinitiv-ui/demo-block": "^6.1.
|
|
355
|
-
"@refinitiv-ui/i18n": "^6.0.
|
|
353
|
+
"@refinitiv-ui/core": "^6.6.1",
|
|
354
|
+
"@refinitiv-ui/demo-block": "^6.1.30",
|
|
355
|
+
"@refinitiv-ui/i18n": "^6.0.22",
|
|
356
356
|
"@refinitiv-ui/phrasebook": "^6.3.9",
|
|
357
|
-
"@refinitiv-ui/test-helpers": "^6.0
|
|
358
|
-
"@refinitiv-ui/translate": "^6.0.
|
|
359
|
-
"@refinitiv-ui/utils": "^6.
|
|
357
|
+
"@refinitiv-ui/test-helpers": "^6.1.0",
|
|
358
|
+
"@refinitiv-ui/translate": "^6.0.36",
|
|
359
|
+
"@refinitiv-ui/utils": "^6.4.0",
|
|
360
360
|
"@types/d3-interpolate": "^3.0.1"
|
|
361
361
|
},
|
|
362
362
|
"peerDependencies": {
|
|
363
363
|
"@refinitiv-ui/browser-sparkline": "^1.0.0 || ^2.0.0",
|
|
364
|
-
"@refinitiv-ui/core": "^6.6.
|
|
365
|
-
"@refinitiv-ui/i18n": "^6.0.
|
|
364
|
+
"@refinitiv-ui/core": "^6.6.1",
|
|
365
|
+
"@refinitiv-ui/i18n": "^6.0.22",
|
|
366
366
|
"@refinitiv-ui/phrasebook": "^6.3.9",
|
|
367
|
-
"@refinitiv-ui/translate": "^6.0.
|
|
368
|
-
"@refinitiv-ui/utils": "^6.
|
|
367
|
+
"@refinitiv-ui/translate": "^6.0.36",
|
|
368
|
+
"@refinitiv-ui/utils": "^6.4.0"
|
|
369
369
|
},
|
|
370
370
|
"publishConfig": {
|
|
371
371
|
"access": "public"
|
|
372
372
|
},
|
|
373
|
-
"gitHead": "
|
|
373
|
+
"gitHead": "745dad9236176349f3bf134aecbdda8eed681c32"
|
|
374
374
|
}
|