From 719e864728fac7f3e0d466623a28b36bd087f4d1 Mon Sep 17 00:00:00 2001 From: Pornchai Korpraserttaworn Date: Sun, 14 Jul 2024 16:45:20 +0700 Subject: [PATCH] Update document for efx-grid v6.0.149 --- index.html | 2 +- resources/elf-halo-dark.js | 1066 +++++++++++++++++++++++------------ resources/elf-halo-light.js | 1066 +++++++++++++++++++++++------------ template-146.html | 23 +- template-46.html | 162 +++++- template-70.html | 283 ++++++++-- 6 files changed, 1821 insertions(+), 781 deletions(-) diff --git a/index.html b/index.html index b516d100..c4e6f8be 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -
Theme :

\ No newline at end of file +
Theme :

\ No newline at end of file diff --git a/resources/elf-halo-dark.js b/resources/elf-halo-dark.js index 190d4082..ddd5b83d 100644 --- a/resources/elf-halo-dark.js +++ b/resources/elf-halo-dark.js @@ -10412,6 +10412,14 @@ Potential causes: * combo-box when parent container handles element states. */ this.transparent = false; + /** + * Show clears button + */ + this.clears = false; + /** + * Internal reference to clears button + */ + this.clearsButtonRef = (0, ref /* createRef */._)(); /** * A reference to input element */ @@ -10438,6 +10446,12 @@ Potential causes: static get observedAttributes() { return Array.from(new Set([...super.observedAttributes, ...ObservedAriaLabel, ...ObservedAriaDescription, ...ObservedAriaRequired])); } + /** + * Get an input element + */ + get clearsButton() { + return this.clearsButtonRef.value; + } /** * Get an input element */ @@ -10661,6 +10675,46 @@ Potential causes: setSelectionRange(startSelection, endSelection, selectionDirection) { this.inputElement?.setSelectionRange(startSelection, endSelection, selectionDirection); } + /** + * Template for clear button + * Rendered when `clears` attribute is set + * @returns Popup template or undefined + */ + get clearButtonTemplate() { + if (this.hasClear) { + return (0, lit /* html */.qy)` + + `; + } + return lit /* nothing */.s6; + } + /** + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event + * @returns {void} + */ + onClearsButtonTap(event) { + this.setValueAndNotify(''); + // Some form control elements, such as Tree Select, display/hide an overlay upon selection. + // PreventDefault() ensures that selecting the clear button would not change overlay state. + event.preventDefault(); + } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); // shouldn't display clear if disabled or readonly + return this.clears && editable && !!this.value; + } } (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, @@ -10677,6 +10731,9 @@ Potential causes: type: Boolean, reflect: true })], FormFieldElement.prototype, "transparent", void 0); + (0, tslib_es6.__decorate)([(0, property /* property */.M)({ + type: Boolean + })], FormFieldElement.prototype, "clears", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaLabel", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaDescription", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaRequired", void 0); @@ -12830,7 +12887,7 @@ Recommended fix: /* harmony export */x: () => ( /* binding */VERSION) /* harmony export */ }); - const VERSION = '6.17.2'; + const VERSION = '6.18.0'; /***/ }), @@ -19529,7 +19586,7 @@ Recommended fix: var proto = $Number.prototype; // Opera ~12 has broken Object#toString var BROKEN_COF = cof(__webpack_require__(4719)(proto)) == NUMBER; - var TRIM = ('trim' in String.prototype); + var TRIM = 'trim' in String.prototype; // 7.1.3 ToNumber(argument) var toNumber = function (argument) { @@ -38890,6 +38947,7 @@ Recommended fix: * @property {string=} rowSpanningField="ROW_SPANNING" Field to be used for spanning segment header rows based on the field values * @property {string=} segmentIdField="" Field used for initializing segments based on text id * @property {string=} collapsingField="" Field used for indicating that the corresponding segment row is collapsed + * @property {string=} parentIdField="" Field used for specifying parent segment of the row * @property {boolean=} defaultCollapsing=false If enabled, any newly created segment will be collapsed by default * @property {(string|number)=} displayColumn=null Render tags in the given column. It can be either the column index, column ID, or field */ @@ -38976,6 +39034,10 @@ Recommended fix: * @private */ RowSegmentingPlugin.prototype._collapsingField = ""; + /** @type {string} + * @private + */ + RowSegmentingPlugin.prototype._parentIdField = ""; /** @type {number} * @private */ @@ -39104,17 +39166,25 @@ Recommended fix: let separatorArr = []; let collapsingAry = []; let expandingAry = []; + let parentId = ""; for (let i = 0; i < rowCount; i++) { rowId = rowIds[i]; rowData = this._rowGetter(dt.getRowData(rowId)); segmentId = rowData[this._segmentIdField]; - if (segmentId == null) { + parentId = rowData[this._parentIdField]; + if (segmentId == null && parentId == null) { continue; } + this._prevSegmentBySegmentId = true; let segmentInfo = segmentMap[segmentId]; + let parentInfo = parentId !== segmentId ? segmentMap[parentId] : null; // WARNING: parent must exist beforehand if (segmentInfo) { + if (parentInfo) { + segmentInfo = parentInfo; + parentInfo = null; + } segmentInfo.rowIds.push(rowId); - } else { + } else if (segmentId) { segmentInfo = segmentMap[segmentId] = { rowIds: [], segmentId: rowId @@ -39130,7 +39200,9 @@ Recommended fix: } } } - this._prevSegmentBySegmentId = true; + if (parentInfo) { + parentInfo.rowIds.push(rowId); + } } if (segmentArr.length) { this.setSegmentSeparators(separatorArr); // TODO: This method can be merged into setSegmentChildren @@ -39198,6 +39270,9 @@ Recommended fix: if (option.collapsingField != null) { this._collapsingField = option.collapsingField; } + if (option.parentIdField != null) { + this._parentIdField = option.parentIdField; + } if (option.predefinedColors != null && typeof option.predefinedColors === "object") { this._predefinedColors = option.predefinedColors; } @@ -39276,6 +39351,9 @@ Recommended fix: if (this._collapsingField) { extOptions.collapsingField = this._collapsingField; } + if (this._parentIdField) { + extOptions.parentIdField = this._parentIdField; + } if (this._defaultCollapsing) { extOptions.defaultCollapsing = true; } @@ -39302,6 +39380,32 @@ Recommended fix: return obj; }; + /** @private + * @function + * @param {!Object} obj + * @param {string} field + * @param {*} val + */ + let _setObjectValue = function (obj, field, val) { + if (field) { + if (!obj.values) { + obj.values = {}; + } + obj.values[field] = val; + } + }; + /** @private + * @function + * @param {!Object} obj + * @param {string} field + */ + let _deleteObjectValue = function (obj, field) { + if (field && obj.values) { + if (obj.values[field]) { + delete obj.values[field]; // Slow + } + } + }; /** @public * @param {Object} rowData row config object * @param {string} rowId @@ -39309,34 +39413,32 @@ Recommended fix: */ RowSegmentingPlugin.prototype.getRowConfigObject = function (rowData, rowId) { let obj = rowData || {}; - if (!this._segmentIdField) { + let segmentIdField = this._segmentIdField; + if (!segmentIdField) { return obj; } - if (obj.values) { - if (obj.values[this._segmentIdField]) { - delete obj.values[this._segmentIdField]; // clear only segmentIdField - } - } - if (this.isSegmentSeparator(rowId)) { - if (!obj.values) { - obj.values = {}; - } - obj.values[this._segmentIdField] = ++this._runningId; - let collapsed = this.isSegmentCollapsed(rowId); - if (this._collapsingField) { - obj.values[this._collapsingField] = collapsed; - } + _deleteObjectValue(obj, segmentIdField); + _deleteObjectValue(obj, this._parentIdField); + let dv = this._getDataView(); + let segment = dv.getSegment(rowId); + if (segment) { + _setObjectValue(obj, segmentIdField, ++this._runningId); + segment.runningId = this._runningId; // WANRING: Add + + let collapsed = segment.isCollapsed(); + _setObjectValue(obj, this._collapsingField, collapsed); if (obj["collapsed"] == null) { // Avoid overriding value from real-time grid obj["collapsed"] = collapsed; } - } else { - let parentId = this.getSegmentParentRowId(rowId); - if (parentId) { - if (!obj.values) { - obj.values = {}; - } - obj.values[this._segmentIdField] = this._runningId; + } + let parentSegment = dv.getSegmentParent(rowId); + if (parentSegment) { + if (this._parentIdField) { + // WARNING: this assumes the parent segment is always appeared before this row id + _setObjectValue(obj, this._parentIdField, parentSegment.runningId || this._runningId); + } else if (!segment) { + _setObjectValue(obj, segmentIdField, this._runningId); } } return obj; @@ -39446,12 +39548,8 @@ Recommended fix: RowSegmentingPlugin.prototype.getSegmentParentRowId = function (rowRef) { let dv = this._getDataView(); if (dv) { - let rowId = ""; - if (typeof rowRef === "number") { - rowId = dv.getRowId(rowRef); // WARNING: This is very slow - } else { - rowId = rowRef; - } + // WARNING: getRowId is slow + let rowId = typeof rowRef === "number" ? dv.getRowId(rowRef) : rowRef; return dv.getSegmentParentRowId(rowId); } return ""; @@ -39550,9 +39648,10 @@ Recommended fix: } else { arg.groupLevel = 0; let indentLevel = 0; - let parentId = this.getSegmentParentRowId(rowId); + let parentId = dv.getSegmentParentRowId(rowId); if (parentId) { - indentLevel = 1; // TODO: Provide a way for segmenting multiple levels. Currently, just one level is supported. + let parentSegment = dv.getSegment(parentId); + indentLevel = parentSegment ? parentSegment.getSegmentLevel() + 1 : 1; arg.nonGroupRow = false; let parentRowData = parentRows[parentId]; if (!parentRowData) { @@ -95956,6 +96055,9 @@ Recommended fix: * @attr {string} placeholder - Set placeholder text * @prop {string} [placeholder=""] - Set placeholder text * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button + * * @fires value-changed - Fired when the user commits a value change. The event is not triggered if `value` property is changed programmatically. * @fires query-changed - Fired when the user changes value in the input to change a query word. If `query-debounce-rate` is set, this event will be triggered after debounce completion. The event is not triggered if `query` property is changed programmatically. * @fires opened-changed - Fired when the user opens or closes control's popup. The event is not triggered if `opened` property is changed programmatically. @@ -95978,10 +96080,6 @@ Recommended fix: * Track opened state of popup */ this.opened = false; - /** - * Show clears button - */ - this.clears = false; this._freeText = false; /** * Set error state @@ -96739,8 +96837,8 @@ Recommended fix: return; } const path = event.composedPath(); - if (this.clearsButtonEl && path.includes(this.clearsButtonEl)) { - this.onClearsButtonTap(); + if (this.clearsButton && path.includes(this.clearsButton)) { + // clear button uses tap event from FormField instead so no-op here return; } if (path.includes(this.toggleButtonEl)) { @@ -96761,15 +96859,15 @@ Recommended fix: } } /** - * Run when tap event happens on clears button + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event * @returns {void} */ - onClearsButtonTap() { - this.freeTextValue = ''; - this.inputText = ''; + onClearsButtonTap(event) { this.setQuery(''); - this.setValueAndNotify(''); - this.openOnFocus(); + super.onClearsButtonTap(event); + this.inputText = ''; + this.inputElement?.focus(); } /** * Run when tap event happens on input wrapper @@ -96903,21 +97001,6 @@ Recommended fix: } return keyboardEvent; } - /** - * Template for clear button - * Rendered when `clears` attribute is set - * @returns Popup template or undefined - */ - get clearButtonTemplate() { - const hasText = this.label || this.query || this.freeTextValue || this.inputText; - if (this.clears && hasText) { - return (0, core_lib /* html */.qy)` -
- -
- `; - } - } /** * Template for selection badge in multiple mode * @returns Selection badge template or undefined @@ -97009,6 +97092,14 @@ Recommended fix: 'aria-activedescendant': this.highlightedItemValue }; } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); + return !!(this.clears && editable && (this.value || this.inputText || this.freeTextValue)); + } /** * Returns a template for input field * @returns Input template @@ -97043,9 +97134,6 @@ Recommended fix: type: Boolean, reflect: true })], ComboBox.prototype, "opened", void 0); - (0, tslib_es6.__decorate)([(0, property /* property */.M)({ - type: Boolean - })], ComboBox.prototype, "clears", void 0); (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, attribute: 'free-text' @@ -97078,7 +97166,6 @@ Recommended fix: })], ComboBox.prototype, "query", null); (0, tslib_es6.__decorate)([query_i('#internal-list')], ComboBox.prototype, "listEl", void 0); (0, tslib_es6.__decorate)([query_i('#toggle-button')], ComboBox.prototype, "toggleButtonEl", void 0); - (0, tslib_es6.__decorate)([query_i('#clears-button')], ComboBox.prototype, "clearsButtonEl", void 0); (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, reflect: true @@ -97125,7 +97212,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-combo-box', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;color:#ccc;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;padding:0}:host([disabled]){border:1px solid rgba(64,64,64,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #7f6400}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #a01c2b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host(:not([readonly])[focused]),:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host([readonly]){cursor:default}:host [part=placeholder]{opacity:.5;opacity:.7}:host [part=label],:host [part=placeholder]{margin-right:3px}:host [part~=icon]{color:#ccc;opacity:.7}:host(:not([readonly]):hover) [part~=icon],:host(:not([readonly])[focused]) [part~=icon]{opacity:1}:host(:not([readonly])[focused]) [part~=icon]{color:#334bff}:host([disabled]) [part~=icon]{color:rgba(64,64,64,.5)}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height)}:host [part~=input-wrapper]{touch-action:manipulation;display:flex;align-items:center;width:100%;height:100%}:host [part~=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;text-overflow:ellipsis;border:1px solid #404040;width:100%;background:0 0;border:none;padding:0 8px}:host [part~=input][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host [part~=input][type=number]{padding-right:0}:host [part~=input][warning]{border:1px solid #7f6400}:host [part~=input][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host [part~=input][error],:host [part~=input][error][warning]{border:1px solid #a01c2b}:host [part~=input][error][disabled],:host [part~=input][error][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host [part~=input] ::-ms-clear{display:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;flex:none;height:100%;width:24px}:host [part~=list]{display:flex;flex-flow:column nowrap}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host [part~=list] ::slotted(ef-list){max-height:inherit}}:host [part=selection-badge]{flex-shrink:0}:host([disabled]) [part~=selection-badge]{opacity:.4}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host([warning]){border-color:#ffc800}:host([error]),:host([error][warning]){border-color:#f5475b}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([disabled]){color:rgba(204,204,204,.5);border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host(:not([readonly])[focused]),:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}:host [part~=input-wrapper]{border-left-color:inherit}:host [part~=button-toggle]{border-left:1px solid #404040;border-left-color:inherit}:host [part~=button-toggle]::before{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;width:24px;border:1px solid transparent}:host(:not([readonly])) [part~=button-clear]:hover{color:#334bff}:host(:not([readonly]):hover) [part~=button-toggle]{color:#334bff}:host(:not([readonly])[focused]) [part~=button-toggle]{border-left-color:#334bff;color:#334bff}:host(:not([readonly])) [part~=button-toggle]:hover{border-left-color:#334bff;color:#fff;background:#1429bd}:host(:not([readonly])) [part~=button-toggle]:hover::after{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid #334bff;pointer-events:none}:host(:not([readonly])) [part~=button-toggle]:active{background:#0f1e8a}:host(:not([readonly])) [part~=button]:active{color:#fff}:host(:not([readonly])) [part~=icon]{color:inherit!important}:host([disabled]) [part~=input]{border:none}:host([disabled]) [part~=button-toggle],:host([readonly]) [part~=button-toggle]{border-left-color:rgba(64,64,64,.5)}:host([readonly]) [part~=button-toggle]{color:rgba(204,204,204,.5);cursor:default}:host([focused][readonly]) [part~=button-toggle]{border-left-color:#334bff}:host [part=list] ::slotted(ef-list){display:block}:host [part=list] ef-list-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;color:#ccc;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;padding:0}:host([disabled]){border:1px solid rgba(64,64,64,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #7f6400}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #a01c2b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host(:not([readonly])[focused]),:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host([readonly]){cursor:default}:host [part=placeholder]{opacity:.5;opacity:.7}:host [part=label],:host [part=placeholder]{margin-right:3px}:host [part~=icon]{color:#ccc;opacity:.7}:host(:not([readonly]):hover) [part~=icon],:host(:not([readonly])[focused]) [part~=icon]{opacity:1}:host(:not([readonly])[focused]) [part~=icon]{color:#334bff}:host([disabled]) [part~=icon]{color:rgba(64,64,64,.5)}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height)}:host [part~=input-wrapper]{touch-action:manipulation;display:flex;align-items:center;width:100%;height:100%}:host [part~=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;text-overflow:ellipsis;border:1px solid #404040;width:100%;background:0 0;border:none;padding:0 8px}:host [part~=input][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host [part~=input][type=number]{padding-right:0}:host [part~=input][warning]{border:1px solid #7f6400}:host [part~=input][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host [part~=input][error],:host [part~=input][error][warning]{border:1px solid #a01c2b}:host [part~=input][error][disabled],:host [part~=input][error][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host [part~=input] ::-ms-clear{display:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;flex:none;height:100%;width:24px}:host [part~=list]{display:flex;flex-flow:column nowrap}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host [part~=list] ::slotted(ef-list){max-height:inherit}}:host [part=selection-badge]{flex-shrink:0}:host([disabled]) [part~=selection-badge]{opacity:.4}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]){border-color:#ffc800}:host([error]),:host([error][warning]){border-color:#f5475b}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([disabled]){color:rgba(204,204,204,.5);border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host(:not([readonly])[focused]),:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}:host [part~=input-wrapper]{border-left-color:inherit}:host [part~=button-toggle]{border-left:1px solid #404040;border-left-color:inherit}:host [part~=button-toggle]::before{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;width:24px;border:1px solid transparent}:host(:not([readonly]):hover) [part~=button-toggle]{color:#334bff}:host(:not([readonly])[focused]) [part~=button-toggle]{border-left-color:#334bff;color:#334bff}:host(:not([readonly])) [part~=button-toggle]:hover{border-left-color:#334bff;color:#fff;background:#1429bd}:host(:not([readonly])) [part~=button-toggle]:hover::after{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid #334bff;pointer-events:none}:host(:not([readonly])) [part~=button-toggle]:active{background:#0f1e8a}:host(:not([readonly])) [part~=button]:active{color:#fff}:host(:not([readonly])) [part~=icon]{color:inherit!important}:host(:not([readonly])) [part~=button-clear]:active,:host(:not([readonly])) [part~=button-clear]:hover{color:#334bff}:host([disabled]) [part~=input]{border:none}:host([disabled]) [part~=button-toggle],:host([readonly]) [part~=button-toggle]{border-left-color:rgba(64,64,64,.5)}:host([readonly]) [part~=button-toggle]{color:rgba(204,204,204,.5);cursor:default}:host([focused][readonly]) [part~=button-toggle]{border-left-color:#334bff}:host [part=list] ::slotted(ef-list){display:block}:host [part=list] ef-list-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/dialog/draggable-element.js @@ -97749,6 +97836,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let NumberField = class NumberField extends core_lib /* FormFieldElement */.x3 { constructor() { @@ -98494,7 +98584,7 @@ Recommended fix: * @return {TemplateResult} Render template */ render() { - return (0, core_lib /* html */.qy)` ${super.render()} ${this.noSpinner ? null : this.renderSpinner()}`; + return (0, core_lib /* html */.qy)` ${super.render()} ${this.clearButtonTemplate} ${this.noSpinner ? null : this.renderSpinner()}`; } }; (0, tslib_es6.__decorate)([(0, property /* property */.M)({ @@ -98525,7 +98615,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-number-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=input]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}:host [part=spinner-down],:host [part=spinner-up]{line-height:0;min-width:22px;color:#ccc}:host [part=spinner]{height:100%;margin-left:8px;border-left:inherit;border-color:inherit}:host(:not([no-spinner])){padding:0 0 0 8px}:host([transparent]),:host([transparent]) [part=spinner]{border:none}:host(:hover:not([readonly])) [part=spinner-down],:host(:hover:not([readonly])) [part=spinner-up]{color:#6678ff}:host(:hover:not([readonly])) [part=spinner-down]:hover,:host(:hover:not([readonly])) [part=spinner-up]:hover{color:#fff;background-color:#1429bd}:host(:hover:not([readonly])) [part=spinner-down]:active,:host(:hover:not([readonly])) [part=spinner-up]:active{color:#fff;background:#0f1e8a}:host(:not([transparent]):not([readonly])) [part=spinner]:hover{border-left-color:#334bff!important;border-left-style:solid!important}:host(:not([transparent]):not([readonly])) [part=spinner]:hover::after{content:\'\';border:1px solid #334bff;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;pointer-events:none}:host([focused]) [part=spinner-down],:host([focused]) [part=spinner-up]{color:#6678ff}:host([disabled]) [part=spinner-down],:host([disabled]) [part=spinner-up],:host([readonly]:not([focused])) [part=spinner-down],:host([readonly]:not([focused])) [part=spinner-up]{color:rgba(204,204,204,.5)}:host([disabled][error]) [part=spinner],:host([readonly]:not([focused])[error]) [part=spinner]{border-color:rgba(250,168,177,.5)}:host([disabled][warning]) [part=spinner],:host([readonly]:not([focused])[warning]) [part=spinner]{border-color:rgba(255,233,153,.5)}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=input]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}:host [part=spinner-down],:host [part=spinner-up]{line-height:0;min-width:22px;color:#ccc}:host [part=spinner]{height:100%;margin-left:8px;border-left:inherit;border-color:inherit}:host(:not([no-spinner])){padding:0 0 0 8px}:host([transparent]),:host([transparent]) [part=spinner]{border:none}:host(:hover:not([readonly])) [part=spinner-down],:host(:hover:not([readonly])) [part=spinner-up]{color:#6678ff}:host(:hover:not([readonly])) [part=spinner-down]:hover,:host(:hover:not([readonly])) [part=spinner-up]:hover{color:#fff;background-color:#1429bd}:host(:hover:not([readonly])) [part=spinner-down]:active,:host(:hover:not([readonly])) [part=spinner-up]:active{color:#fff;background:#0f1e8a}:host(:not([transparent]):not([readonly])) [part=spinner]:hover{border-left-color:#334bff!important;border-left-style:solid!important}:host(:not([transparent]):not([readonly])) [part=spinner]:hover::after{content:\'\';border:1px solid #334bff;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;pointer-events:none}:host([focused]) [part=spinner-down],:host([focused]) [part=spinner-up]{color:#6678ff}:host([disabled]) [part=spinner-down],:host([disabled]) [part=spinner-up],:host([readonly]:not([focused])) [part=spinner-down],:host([readonly]:not([focused])) [part=spinner-up]{color:rgba(204,204,204,.5)}:host([disabled][error]) [part=spinner],:host([readonly]:not([focused])[error]) [part=spinner]{border-color:rgba(250,168,177,.5)}:host([disabled][warning]) [part=spinner],:host([readonly]:not([focused])[warning]) [part=spinner]{border-color:rgba(255,233,153,.5)}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/pill/index.js @@ -99112,6 +99202,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let TextField = class TextField extends core_lib /* FormFieldElement */.x3 { constructor() { @@ -99330,7 +99423,7 @@ Recommended fix: * @return Render template */ render() { - return (0, core_lib /* html */.qy)` ${super.render()} ${this.renderIcon()} `; + return (0, core_lib /* html */.qy)` ${super.render()} ${this.clearButtonTemplate} ${this.renderIcon()} `; } }; (0, tslib_es6.__decorate)([(0, property /* property */.M)({ @@ -99398,6 +99491,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let SearchField = class SearchField extends TextField { /** @@ -99440,7 +99536,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-search-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/select/index.js @@ -100390,7 +100486,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=placeholder]{opacity:.7}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=placeholder]{opacity:.7}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/text-field/themes/halo/dark/index.js @@ -100398,7 +100494,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-text-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}' } })); ; // CONCATENATED MODULE: ./node_modules/lit/node_modules/lit-html/directives/guard.js @@ -119408,6 +119504,9 @@ Recommended fix: * @attr {string} placeholder - Set placeholder text default depends on format * @prop {string} [placeholder="dd-MMM-yyyy"] - Set placeholder text default depends on format * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button + * * @slot header - Slot to add custom contents at the top of popup * @slot right - Slot to add custom contents at the right of popup * @slot footer - Slot to add custom contents at the bottom of popup @@ -120078,6 +120177,8 @@ Recommended fix: } if (path.includes(this.iconEl)) { this.toggleOpened(); + } else if (this.clearsButton && path.includes(this.clearsButton)) { + this.onClearsButtonTap(event); } else if (!this.inputTriggerDisabled) { this.setOpened(true); } @@ -120204,6 +120305,45 @@ Recommended fix: this.submitInterimSegments(); this.validateInput(); } + /** + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event + * @returns {void} + */ + onClearsButtonTap(event) { + let values = []; + // When the element's input is cleared by typing, + // an array of empty string(s) will be assign to `values`. + // Clear button logic simply follows this behavior for consistency. + // TODO: `values` should be set to an empty array once the input has been cleared. + if (this.inputFromEl && this.inputToEl) { + // range mode + this.inputFromEl.value = ''; + this.inputToEl.value = ''; + values = ['', '']; + } else if (this.inputEl) { + // single mode + this.inputEl.value = ''; + values = ['']; + } + this.notifyValuesChange(values); + this.inputValues = values; + this.resetViews(); + // `validateInput()` and `requestUpdate()` for the case that there is no `values` change. + this.validateInput(); + this.requestUpdate(); + // PreventDefault() ensures that selecting the clear button would not change `opened` state. + event.preventDefault(); + } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); // shouldn't display clear if disabled or readonly + const hasInputValue = this.range ? !!this.inputValues[0] || !!this.inputValues[1] : !!this.inputValues[0]; + return this.clears && editable && hasInputValue; + } /** * Check if input format conforms to value format * @returns true if valid format @@ -120461,7 +120601,7 @@ Recommended fix:
${this.getInputTemplate(this.range ? INPUT_FROM_ID : INPUT_ID, values[0])} ${this.range ? (0, core_lib /* html */.qy)`
` : undefined} - ${this.range ? this.getInputTemplate(INPUT_TO_ID, values[1]) : undefined} + ${this.range ? this.getInputTemplate(INPUT_TO_ID, values[1]) : undefined} ${this.clearButtonTemplate}
`; } @@ -120618,7 +120758,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-datetime-picker', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;line-height:24px}:host([disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host([warning]){border:1px solid #7f6400}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #a01c2b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=time-picker]{margin:0}:host [part=timepicker-wrapper]{box-shadow:inset 0 1px 0 0 #404040;box-shadow:none;padding:0 3px 4px}:host([range]) ef-text-field{text-align:center}:host [part=input]{color:inherit}:host [part=icon]{color:#ccc;color:inherit}:host [part=input-separator]{line-height:24px;background:#ccc;width:.4em;margin:auto 0;height:1px}:host [part=calendar]{width:196px;padding:4px 3px}:host [part=list]{margin-top:2px;border:1px solid #334bff;background-color:#262626}:host([range]){width:304px}:host([warning]:not([focused])){border-color:#ffc800}:host([error]:not([focused])){border-color:#f5475b}:host([warning]:hover:not([readonly]):not([focused])){border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])){border-color:rgba(250,168,177,.5)}:host([disabled]) [part=icon]{color:rgba(204,204,204,.5)}:host(:not([disabled]):not([error]):not([warning]):hover) [part=icon],:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;line-height:24px}:host([disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host([warning]){border:1px solid #7f6400}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #a01c2b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=time-picker]{margin:0}:host [part=timepicker-wrapper]{box-shadow:inset 0 1px 0 0 #404040;box-shadow:none;padding:0 3px 4px}:host([range]) ef-text-field{text-align:center}:host [part=input]{color:inherit}:host [part=icon]{color:#ccc;color:inherit}:host [part=input-separator]{line-height:24px;background:#ccc;width:.4em;margin:auto 0;height:1px}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host [part=calendar]{width:196px;padding:4px 3px}:host [part=list]{margin-top:2px;border:1px solid #334bff;background-color:#262626}:host([range]){width:304px}:host([warning]:not([focused])){border-color:#ffc800}:host([error]:not([focused])){border-color:#f5475b}:host([warning]:hover:not([readonly]):not([focused])){border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])){border-color:rgba(250,168,177,.5)}:host([disabled]) [part=icon]{color:rgba(204,204,204,.5)}:host(:not([disabled]):not([error]):not([warning]):hover) [part=icon],:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/pagination/index.js @@ -121149,7 +121289,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-pagination', - styles: ':host [part=container]{align-items:center;justify-content:flex-end}:host [part=label]{clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}:host [part=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;font-weight:400;max-width:100%;padding:0 8px;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;touch-action:manipulation;min-width:40px;text-align:center;height:22px;width:150px;margin:0}:host [part=input][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host [part=input][type=number]{padding-right:0}:host [part=input][warning]{border:1px solid #7f6400}:host [part=input][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host [part=input][error],:host [part=input][error][warning]{border:1px solid #a01c2b}:host [part=input][error][disabled],:host [part=input][error][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host [part=input] ::-ms-clear{display:none}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:hover{border-color:grey;color:#fff}:host [part=input]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=button]{touch-action:manipulation}:host{margin:1px 0}:host [part=input]::-moz-selection{color:#fff;background-color:#334bff}:host [part=input]::selection{color:#fff;background-color:#334bff}:host [part=buttons]{margin:0}' + styles: ':host [part=container]{align-items:center;justify-content:flex-end}:host [part=label]{clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}:host [part=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;font-weight:400;max-width:100%;padding:0 8px;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#ccc;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;touch-action:manipulation;min-width:40px;text-align:center;height:22px;width:150px;margin:0}:host [part=input][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(64,64,64,.5)}:host [part=input][type=number]{padding-right:0}:host [part=input][warning]{border:1px solid #7f6400}:host [part=input][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host [part=input][error],:host [part=input][error][warning]{border:1px solid #a01c2b}:host [part=input][error][disabled],:host [part=input][error][warning][disabled]{color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host [part=input] ::-ms-clear{display:none}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:hover{border-color:grey;color:#fff}:host [part=input]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=button]{touch-action:manipulation}:host{margin:1px 0}:host [part=input]::-moz-selection{color:#fff;background-color:#334bff}:host [part=input]::selection{color:#fff;background-color:#334bff}:host [part=buttons]{margin:0}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/overlay-menu/helpers/constants.js @@ -128183,7 +128323,7 @@ Recommended fix: */ let Segment_Segment = function (rid, sharedObj) { this._rid = rid; - this._children = {}; + this._childIds = []; this._shared = sharedObj; if (sharedObj.defaultCollapsing) { this._collapsed = true; @@ -128212,14 +128352,6 @@ Recommended fix: } return 0; }; - /** @private - * @function - * @param {Segment} segment - * @param {number} idx - */ - Segment_Segment._assignSubSegmentOrder = function (segment, idx) { - segment.setOrder(idx + 1); - }; /** @type {Object} * @private @@ -128230,14 +128362,14 @@ Recommended fix: * @private */ Segment_Segment.prototype._rid; - /** @type {!Object} + /** @type {!Array.} * @private */ - Segment_Segment.prototype._children; - /** @type {number} + Segment_Segment.prototype._childIds; + /** @type {Object} * @private */ - Segment_Segment.prototype._childCount = 0; + Segment_Segment.prototype._childDataIds = null; /** @type {boolean} * @private */ @@ -128246,6 +128378,14 @@ Recommended fix: * @private */ Segment_Segment.prototype._order = 0; + /** @type {number} + * @private + */ + Segment_Segment.prototype._offsetOrder = 0; + /** @type {number} + * @private + */ + Segment_Segment.prototype._depth = 0; /** @type {boolean} * @private */ @@ -128255,10 +128395,10 @@ Recommended fix: * @private */ Segment_Segment.prototype._subSegDef = null; - /** @type {number} + /** @type {boolean} * @private */ - Segment_Segment.prototype._subSegLevel = 0; + Segment_Segment.prototype._subSegment = false; // This indicates that the segment is autogenerated (subsegment) /** @type {Object.} * @private */ @@ -128266,7 +128406,7 @@ Recommended fix: /** @type {Array.} * @private */ - Segment_Segment.prototype._subSegNames = null; // For immediate sub-segment child names + Segment_Segment.prototype._subSegNames = null; // For immediate sub-segment child names/ids /** @type {string} * @private */ @@ -128275,10 +128415,6 @@ Recommended fix: * @private */ Segment_Segment.prototype._subSegVal; - /** @type {Segment} - * @private - */ - Segment_Segment.prototype._subSegParent = null; /** @public */ @@ -128298,13 +128434,12 @@ Recommended fix: this._subSegMap = this._subSegNames = null; } if (this._collapsed) { - if (this._childCount || this._subSegDef) { - this._shared.dirtyCollapsingState = true; - } + this.markCollapsingStateDirty(); } - this._childCount = 0; + this._childDataIds = null; + this._childIds.length = 0; this._shared = null; - this._subSegParent = this._subSegDef = this._subSegVal = null; + this._subSegDef = this._subSegVal = null; }; /** @public * @return {string} @@ -128316,10 +128451,17 @@ Recommended fix: * @return {string} */ Segment_Segment.prototype.getParentId = function () { - if (this._subSegParent) { - return this._subSegParent.getId(); + return this._shared.childToSegment[this._rid] || ""; + }; + /** @public + * @return {Segment} + */ + Segment_Segment.prototype.getParent = function () { + let parentId = this.getParentId(); + if (parentId) { + return this._shared.segments[parentId] || null; } - return ""; + return null; }; /** @public * @param {Array.=} out_ary @@ -128346,21 +128488,43 @@ Recommended fix: /** @public * @param {string} rid * @param {string=} dataId Row id for retrieving data - * @return {boolean} + * @return {boolean} Returns true only a new child is added */ Segment_Segment.prototype.addChild = function (rid, dataId) { - if (rid) { + if (!rid) { + return false; + } + let prevSegmentId = this._shared.childToSegment[rid]; + if (prevSegmentId) { + if (prevSegmentId !== this._rid) { + let prevSegment = this._shared.segments[prevSegmentId]; + if (prevSegment && !prevSegment.hasSubSegments()) { + // Children of a classified segment always stick the root segment + prevSegment.removeChild(rid); + } + this._shared.childToSegment[rid] = this._rid; + } + } else { this._shared.childToSegment[rid] = this._rid; - if (this._children[rid]) { - this._children[rid] = dataId || rid; // Update data id - } else { - if (this._collapsed) { - this._shared.dirtyCollapsingState = true; // TODO: Check if we need to update this only when new child is added + } + if (dataId != null) { + // Update data id + if (dataId && dataId !== rid) { + if (!this._childDataIds) { + this._childDataIds = {}; } - this._children[rid] = dataId || rid; - ++this._childCount; - return true; + this._childDataIds[rid] = dataId; + } else if (this._childDataIds) { + delete this._childDataIds[rid]; + } + } + let at = this._childIds.indexOf(rid); + if (at < 0) { + if (this._collapsed) { + this._shared.dirtyCollapsingState = true; // TODO: Check if we need to update this only when new child is added } + this._childIds.push(rid); + return true; } return false; }; @@ -128370,8 +128534,14 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.addChildren = function (rids, dataIds) { + if (!rids) { + return false; + } let rowIds = Array.isArray(rids) ? rids : [rids]; let rowCount = rowIds.length; + if (!rowCount) { + return false; + } let dirty = 0; let i; if (dataIds != null) { @@ -128391,26 +128561,35 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.containsChild = function (rid) { - return this._children[rid] ? true : false; + return this._childIds.indexOf(rid) >= 0; + }; + /** @public + * @param {string} rid + * @return {number} + */ + Segment_Segment.prototype.getChildIndex = function (rid) { + return this._childIds.indexOf(rid); }; /** @public * @param {string} rid * @return {boolean} */ Segment_Segment.prototype.removeChild = function (rid) { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + if (!this._childIds.length) { return false; } - if (!this._children[rid]) { + let at = this._childIds.indexOf(rid); + if (at < 0) { return false; // The specified rid is not a child of this segment } - let objMap = this._shared.childToSegment; - delete objMap[rid]; - delete this._children[rid]; // Slow - --this._childCount; + if (this._shared.childToSegment[rid] === this._rid) { + delete this._shared.childToSegment[rid]; + } + this._childIds.splice(at, 1); // Slow + if (this._collapsed) { this._shared.dirtyCollapsingState = true; } @@ -128421,10 +128600,10 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.removeChildren = function (rids) { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + if (!this._childIds.length) { return false; } let rowIds = Array.isArray(rids) ? rids : [rids]; @@ -128439,21 +128618,24 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.removeAllChildren = function () { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + let childCount = this._childIds.length; + if (!this._childIds.length) { return false; } + let segmentId = this._rid; let objMap = this._shared.childToSegment; - let chdr = this._children; - for (let rid in chdr) { - if (objMap[rid]) { - delete objMap[rid]; // TODO: Check if we need to do this + let chdr = this._childIds; + for (let i = 0; i < childCount; ++i) { + let rid = chdr[i]; + if (objMap[rid] === segmentId) { + delete objMap[rid]; } } - this._children = {}; - this._childCount = 0; + this._childIds.length = 0; + this._childDataIds = null; if (this._collapsed) { this._shared.dirtyCollapsingState = true; } @@ -128463,23 +128645,40 @@ Recommended fix: * @return {!Array.} */ Segment_Segment.prototype.getChildIds = function () { - return this._childCount ? Object.keys(this._children) : []; + return this._childIds; // WARNING: Returns private members }; /** @public * @return {!Object} */ Segment_Segment.prototype.getChildren = function () { - return this._children; + let obj = {}; + let chdr = this._childIds; + let childCount = chdr.length; + let dataIds = this._childDataIds || {}; + for (let i = 0; i < childCount; ++i) { + let rid = chdr[i]; + obj[rid] = dataIds[rid] || rid; + } + return obj; }; /** @public * @return {number} */ Segment_Segment.prototype.getChildCount = function () { - return this._childCount; + return this._childIds.length; + }; + /** When a segment is not empty, the visibility of its content need to be updated. + * @public + */ + Segment_Segment.prototype.markCollapsingStateDirty = function () { + // A segment can have a child and/or autogenerated segment (subsegment) to not be considered as empty. + if (this._childIds.length || this._subSegDef) { + this._shared.dirtyCollapsingState = true; + } }; /** @public - * @return {Array.} fields + * @return {Array.} */ Segment_Segment.prototype.getClassification = function () { if (this._subSegDef) { @@ -128492,8 +128691,8 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.setClassification = function (fields) { - if (this._subSegLevel) { - return false; // non-root segment cannot be classified + if (this._subSegment) { + return false; // subsegment cannot be classified } let classifiers = null; if (this._subSegDef) { @@ -128534,9 +128733,8 @@ Recommended fix: } else if (classifiers) { // Remove existing ones this._subSegDef.classifiers = null; - this._subSegDef.subSegments = null; // this._subSegDef.classifierChanged = true; - this._subSegDef = null; // WARNING: All sub segments remain existing + this._subSegDef = null; // WARNING: All subsegments remain existing return true; } return false; @@ -128551,7 +128749,7 @@ Recommended fix: let segmentNames = this._subSegNames; let segmentCount = segmentNames ? segmentNames.length : 0; if (!segmentCount) { - if (this._subSegLevel >= classifierCount) { + if (this._depth >= classifierCount) { return false; // Current segment level is beyond existing classification level and this segment should already be removed } } @@ -128560,7 +128758,7 @@ Recommended fix: sharedObj.dirtyCollapsingState = true; } - // Prepare existing sub segments for checking change in its members + // Prepare existing subsegments for checking change in its members let i; let segmentName = ""; let nonExistenceGroups = {}; @@ -128573,10 +128771,9 @@ Recommended fix: segmentName = segmentNames[i]; nonExistenceGroups[segmentName] = 1; segment = segmentMap[segmentName]; - if (segment._childCount) { + if (segment._childIds.length) { // Quick cleaning up - segment._children = {}; - segment._childCount = 0; + segment._childIds.length = 0; } if (segment._collapsed) { sharedObj.dirtyCollapsingState = true; @@ -128584,18 +128781,21 @@ Recommended fix: } } - // Loop through row children and assign them to their corresponding sub segment - let isRootSegment = !this._subSegLevel; + // Loop through row children and assign them to their corresponding subsegment + let rootSegment = !this._subSegment; + let dataIds = this._childDataIds || {}; let rid; - let children = this._children; - if (this._subSegLevel < classifierCount && rows) { + let chdr = this._childIds; + let childCount = chdr.length; + if (this._depth < classifierCount && rows) { if (!segmentMap) { segmentMap = this._subSegMap = {}; segmentNames = this._subSegNames = []; } - let classifier = classifiers[this._subSegLevel]; - for (rid in children) { - let dataId = children[rid]; + let classifier = classifiers[this._depth]; + for (i = 0; i < childCount; ++i) { + rid = chdr[i]; + let dataId = dataIds[rid] || rid; let record = rows[dataId]; let val = record ? record[classifier] : null; // WARNING: row could already be removed @@ -128613,29 +128813,33 @@ Recommended fix: segment = segmentMap[segmentName]; if (!segment) { // New group is detected - segment = new Segment_Segment(this._rid + "/" + segmentName, sharedObj); + let subSegId = this._rid + "/" + segmentName; + segment = new Segment_Segment(subSegId, sharedObj); segment._subSegDef = this._subSegDef; - segment._subSegLevel = this._subSegLevel + 1; + segment._subSegment = true; // this indicates that the segment is autogenerated (subsegment) + segment._depth = this._depth + 1; segment._subSegName = segmentName; segment._subSegVal = val; - segment._subSegParent = this; + sharedObj.childToSegment[subSegId] = this._rid; // WARNING: this will mix autogenerated rows with actual rows + segmentMap[segmentName] = segment; segmentNames.push(segmentName); this._dispatch("subSegmentAdded", { - "rid": segment.getId(), + "rid": subSegId, "segment": segment }); } segment.addChild(rid, dataId); } - } else if (isRootSegment) { + } else if (rootSegment) { // In case of no classification - for (rid in children) { + for (i = 0; i < childCount; ++i) { + rid = chdr[i]; sharedObj.childToSegment[rid] = this._rid; // Relocate child in case of it has been moved to a non existence group } } - // Remove all sub segments with no members + // Remove all subsegments with no members if (removalCount > 0) { if (removalCount >= segmentNames.length) { segmentNames.length = 0; @@ -128662,7 +128866,7 @@ Recommended fix: } } - // Sort and classify existing sub segments + // Sort and classify existing subsegments segmentCount = segmentNames ? segmentNames.length : 0; if (segmentCount) { segmentNames.sort(Segment_Segment._subSegSortLogic); @@ -128672,23 +128876,17 @@ Recommended fix: } } - // Collecting all sub segments including all descendants and reassigning segment order. - if (isRootSegment) { - // If this is a root segment - if (this._subSegDef) { - if (segmentCount) { - let subSegments = this._subSegDef.subSegments = []; - this.getAllSubSegments(subSegments); - subSegments.forEach(Segment_Segment._assignSubSegmentOrder); - } else { - this._subSegDef.subSegments = null; - } - // this._subSegDef.classifierChanged = false; + // Collecting all subsegments including all descendants and reassigning segment order. + if (rootSegment && this._subSegDef) { + if (segmentCount) { + this.calcSubSegmentOrder(0); } + // this._subSegDef.classifierChanged = false; } return true; }; - /** @public + /** SubSegment implies being classified + * @public * @return {boolean} */ Segment_Segment.prototype.hasSubSegments = function () { @@ -128697,21 +128895,40 @@ Recommended fix: } return false; }; - /** @public + /** SubSegment implies autogenerated segment + * @public * @return {boolean} */ Segment_Segment.prototype.isSubSegment = function () { - return this._subSegLevel ? true : false; + return this._subSegment; + }; + /** @public + * @return {boolean} + */ + Segment_Segment.prototype.isRootSegment = function () { + return this._shared.childToSegment[this._rid] ? false : true; }; /** @public * @return {Segment} */ Segment_Segment.prototype.getFirstAncestor = function () { - if (this._subSegLevel && this._subSegDef) { - let ancestor = this._subSegDef.root; - return /** @type{Segment} */ancestor || null; + let ancestor = null; + if (this._subSegment && this._subSegDef) { + // Quick way to get root + ancestor = this._subSegDef.root; + } else { + // Slow + ancestor = this.getParent(); + if (ancestor) { + let parentSeg = ancestor.getParent(); + while (parentSeg) { + // This could cause infinite loop + ancestor = parentSeg; + parentSeg = ancestor.getParent(); + } + } } - return null; + return ancestor || null; }; /** @public * @param {Array.=} out_ary @@ -128733,13 +128950,74 @@ Recommended fix: } return out_ary || null; }; + /** This method sets order, last order, and depth to entire tree structure in the segment, including the segment itself + * @public + * @param {number} counter + * @return {number} + */ + Segment_Segment.prototype.updateTreeStructure = function (counter) { + if (!counter) { + counter = 0; + if (!this._subSegment) { + // Subsegment's depth cannot be reset back to 0 + this._depth = 0; // WARNING: this assumes counter at 0 is the root segment + } + } + if (this.hasSubSegments()) { + return this.setLastOrder(counter); // Sub segments has already been calculated + } + let segmentSeparators = this._shared.segments; + let childCount = this._childIds.length; + let prevSeg = null; + for (let i = 0; i < childCount; ++i) { + let rid = this._childIds[i]; + let segment = segmentSeparators[rid]; + let segmentId = segment ? segment.getId() : "Uncategorized"; + if (prevSeg !== segmentId) { + ++counter; // 0 become 1 + prevSeg = segmentId; + } + if (segment) { + segment._depth = this._depth + 1; + segment.setOrder(counter); + counter = segment.updateTreeStructure(counter); + } + } + return this.setLastOrder(counter); + }; + /** @public + * @param {number} counter + * @return {number} + */ + Segment_Segment.prototype.calcSubSegmentOrder = function (counter) { + if (!this.hasSubSegments()) { + return this.setLastOrder(counter); + } + let segmentMap = this._subSegMap; + let childCount = this._subSegNames.length; + let prevSeg = null; + for (let i = 0; i < childCount; ++i) { + let segmentName = this._subSegNames[i]; + let segment = segmentMap[segmentName]; + let segmentId = segment ? segment.getId() : "Uncategorized"; + if (prevSeg !== segmentId) { + ++counter; // 0 become 1 + prevSeg = segmentId; + } + if (segment) { + segment.setOrder(counter); + counter = segment.calcSubSegmentOrder(counter); + } + } + return this.setLastOrder(counter); + }; /** @public * @return {number} */ Segment_Segment.prototype.getSegmentLevel = function () { - return this._subSegLevel; + return this._depth; }; - /** This method will be called on sub segments only + /** This method will be called on subsegments only * @public * @param {Object=} rows * @param {Object=} clsSource @@ -128762,7 +129040,7 @@ Recommended fix: let segment = this; while (segment && segment.isSubSegment()) { segment.getSubSegmentName(row); - segment = segment._subSegParent; + segment = segment.getParent(); } }; /** @public @@ -128770,9 +129048,9 @@ Recommended fix: * @return {string} */ Segment_Segment.prototype.getSubSegmentName = function (row) { - if (row && this._subSegLevel) { + if (row && this._subSegment) { let classifiers = this.getClassification(); - let field = classifiers[this._subSegLevel - 1]; + let field = classifiers[this._depth - 1]; if (field) { row[field] = this._subSegName; } @@ -128788,9 +129066,7 @@ Recommended fix: bool = bool !== false; if (this._collapsed !== bool) { this._collapsed = bool; - if (this._childCount || this._subSegDef) { - this._shared.dirtyCollapsingState = true; - } + this.markCollapsingStateDirty(); return true; } return false; @@ -128808,84 +129084,86 @@ Recommended fix: Segment_Segment.prototype.isCollapsed = function () { return this._collapsed; }; - /** @public + /** Get all collapsing state from all children (subsegments and child segments), excluding the segment itself + * @public * @param {Object=} objMap * @param {boolean=} parentState=false Collapsing state from parent segment * @return {boolean} */ Segment_Segment.prototype.getCollapsingStates = function (objMap, parentState) { - let segmentNames = this._subSegNames; - if (!this._subSegLevel) { - // Only root segment - if (!segmentNames) { - // No sub segment - if (!this._collapsed) { - return false; - } - } + let childList = this._subSegNames; + let segmentMap = this._subSegMap; + let subSegment = true; // Normal segments can have subsegments without being subsegment themselve + if (!childList && this._shared) { + // Ensure that segment has not been disposed + childList = this._childIds; + segmentMap = this._shared.segments; + subSegment = false; + } + let childCount = childList ? childList.length : 0; + if (!childCount) { + return false; } + let dirty = false; + let childCollapsed = parentState || this._collapsed ? true : false; if (!objMap) { objMap = {}; } - let dirty = false; - if (this._subSegLevel) { - // Sub segments are also subjected to collapsing - if (parentState) { - objMap[this._rid] = true; + for (let i = 0; i < childCount; ++i) { + let rid = ""; + let segment = null; + if (subSegment) { + segment = segmentMap[childList[i]]; // Use segment name to retrieve subsegment + rid = segment.getId(); + } else { + rid = childList[i]; + segment = segmentMap[rid]; // Use row id to retrieve segment from shared map + } + if (childCollapsed) { + objMap[rid] = childCollapsed; // Collapsing states for all children is registered here dirty = true; } - } - if (this._childCount) { - let collapsed = parentState || this._collapsed; - if (segmentNames) { - let segmentMap = this._subSegMap; - let segmentCount = segmentNames.length; - for (let i = 0; i < segmentCount; ++i) { - let segment = segmentMap[segmentNames[i]]; - objMap[segment.getId()] = !!parentState; - if (segment.getCollapsingStates(objMap, collapsed)) { - dirty = true; - } - } - } else if (collapsed) { - let chdr = this._children; - for (let rid in chdr) { - objMap[rid] = collapsed; - } + if (segment && segment.getCollapsingStates(objMap, childCollapsed)) { dirty = true; } } return dirty; }; + /** @private + * @return {number} + */ + Segment_Segment.prototype._getOrder = function () { + return this._order * 10000; + }; + /** @private + * @return {number} + */ + Segment_Segment.prototype._getLastOrder = function () { + return this._getOrder() + this._offsetOrder; + }; /** @public * @return {number} */ Segment_Segment.prototype.getOrder = function () { - if (this._subSegLevel) { - let ancestor = this.getFirstAncestor(); - if (ancestor) { - // WARNING: this._order cannot be greater than 9999 - return ancestor.getOrder() + this._order; - } + let ancestor = this.getFirstAncestor(); + if (ancestor) { + // WARNING: this._order cannot be greater than 9999 + return ancestor._getOrder() + this._order; } - return this._order * 10000; + return this._getOrder(); }; /** Get the last (highest) order from the entire tree regardless of the current position segment in the hierachy * @public * @return {number} */ Segment_Segment.prototype.getLastOrder = function () { - if (this._subSegDef) { - let subSegments = this._subSegDef.subSegments; - if (subSegments) { - let lastSegment = subSegments[subSegments.length - 1]; - if (lastSegment) { - return lastSegment.getOrder(); - } - } + let ancestor = this.getFirstAncestor(); + if (ancestor) { + // WARNING: this._order cannot be greater than 9999 + return ancestor._getLastOrder(); } - return this.getOrder(); + return this._getLastOrder(); }; /** @public * @param {number} val @@ -128893,6 +129171,13 @@ Recommended fix: Segment_Segment.prototype.setOrder = function (val) { this._order = val; }; + /** @public + * @param {number} val + * @returns {number} Returns the number set + */ + Segment_Segment.prototype.setLastOrder = function (val) { + return this._offsetOrder = val; + }; /** @private * @type {Array.} @@ -128900,9 +129185,10 @@ Recommended fix: Segment_Segment._tabs = null; /** @public * @param {Array.=} lines + * @param {number=} tabLevel * @return {!Array.} lines */ - Segment_Segment.prototype.log = function (lines) { + Segment_Segment.prototype.log = function (lines, tabLevel) { if (!lines) { lines = []; } @@ -128916,19 +129202,37 @@ Recommended fix: tabCh += " "; } } + if (!tabLevel) { + tabLevel = 0; + } let collapsedCh = this._collapsed ? "+ " : "- "; - lines.push(tabs[this._subSegLevel] + collapsedCh + this._rid); - let segmentNames = this._subSegNames; - if (segmentNames) { - let segmentCount = segmentNames.length; - let segmentMap = this._subSegMap; - for (i = 0; i < segmentCount; ++i) { - segmentMap[segmentNames[i]].log(lines); + lines.push(tabs[tabLevel] + collapsedCh + this._rid); + let childLevel = tabLevel + 1; + let childIndent = tabs[childLevel]; + let childList = this._subSegNames; + let segmentMap = this._subSegMap; + let subSegment = true; // Normal segments can have subsegments without being subsegment themselve + if (!childList && this._shared) { + // Ensure that segment has not been disposed + childList = this._childIds; + segmentMap = this._shared.segments; + subSegment = false; + } + let childCount = childList ? childList.length : 0; + for (i = 0; i < childCount; ++i) { + let rid = ""; + let segment = null; + if (subSegment) { + segment = segmentMap[childList[i]]; // Use segment name to retrieve subsegment + rid = segment.getId(); + } else { + rid = childList[i]; + segment = segmentMap[rid]; // Use row id to retrieve segment from shared map } - } else if (this._childCount) { - let indent = tabs[this._subSegLevel + 1]; - for (let rid in this._children) { - lines.push(indent + "- " + rid); + if (segment) { + segment.log(lines, childLevel); + } else { + lines.push(childIndent + "- " + rid); } } return lines; @@ -128948,6 +129252,7 @@ Recommended fix: this._insertionList = []; this._removalList = []; this._shared = { + segments: this._segments, childToSegment: {}, // child Id to segment Id dirtyCollapsingState: false, @@ -129008,10 +129313,6 @@ Recommended fix: */ SegmentCollection.prototype.addSegment = function (rid, childRids) { if (rid && !this._segments[rid]) { - if (this.getParentRowId(rid)) { - console.log("child of a segment cannot be set as a segment separator"); - return false; - } let segment = this._segments[rid] = new data_Segment(rid, this._shared); segment.addEventListener("subSegmentAdded", this._onSubSegmentAdded); segment.addEventListener("subSegmentRemoved", this._onSubSegmentRemoved); @@ -129058,32 +129359,40 @@ Recommended fix: */ SegmentCollection.prototype.removeSegment = function (rid) { let segment = this._segments[rid]; - if (segment) { - if (this._segmentCount <= 1) { - return this.removeAllSegments(); - } - if (segment.isSubSegment()) { - this._removalList.push(segment.getId()); - } - let subSegIds = segment.getSubSegmentIds(); - if (subSegIds) { - let len = subSegIds.length; - for (let i = 0; i < len; ++i) { - let subSegId = subSegIds[i]; - if (this._segments[subSegId]) { - this._removalList.push(subSegId); - delete this._segments[subSegId]; // Slow - --this._segmentCount; - } + if (!segment) { + return false; + } + if (this._segmentCount <= 1) { + return this.removeAllSegments(); + } + let subSegment = segment.isSubSegment(); + if (subSegment) { + this._removalList.push(segment.getId()); + } + let subSegIds = segment.getSubSegmentIds(); + if (subSegIds) { + let len = subSegIds.length; + for (let i = 0; i < len; ++i) { + let subSegId = subSegIds[i]; + if (this._segments[subSegId]) { + this._removalList.push(subSegId); + delete this._segments[subSegId]; // Slow + --this._segmentCount; } } - segment.removeAllChildren(); // This is important for updating childToSegment - segment.dispose(); - delete this._segments[rid]; // Slow - --this._segmentCount; - return true; } - return false; + if (!subSegment) { + let parentSeg = segment.getParent(); + if (parentSeg) { + // Move existing children to its parent + parentSeg.addChildren(segment.getChildIds()); // WARNING: passing private member + } + } + segment.removeAllChildren(); // This is important for updating childToSegment + segment.dispose(); + delete this._segments[rid]; // Slow + --this._segmentCount; + return true; }; /** @public * @return {boolean} Returns true if there is any change. Otherwise, returns false @@ -129096,6 +129405,7 @@ Recommended fix: this._segments = {}; this._segmentCount = 0; this._segmentList = null; + this._shared.segments = this._segments; this._shared.childToSegment = {}; this._classification = this._classifierChanged = false; return true; @@ -129219,7 +129529,7 @@ Recommended fix: collapsedRids = {}; for (let rid in segmentSeparators) { let segment = segmentSeparators[rid]; - if (!segment.isSubSegment()) { + if (segment.isRootSegment()) { if (segment.getCollapsingStates(collapsedRids)) { ++count; } @@ -129231,6 +129541,31 @@ Recommended fix: return this._collapsedRids; }; + /** Invalidate segment order cache, if the given row id is a segment separator + * @private + * @param {string|Array.} segmentIds + * @returns {boolean} Returns true if there is any change + */ + SegmentCollection.prototype._invalidateSegmentOrder = function (segmentIds) { + if (this._segmentList) { + if (typeof segmentIds === "string") { + if (this._segments[segmentIds]) { + this._segmentList = null; + return true; + } + } else if (Array.isArray(segmentIds)) { + let len = segmentIds.length; + for (let i = 0; i < len; ++i) { + let segmentId = segmentIds[i]; + if (this._segments[segmentId]) { + this._segmentList = null; + return true; + } + } + } + } + return false; + }; /** @public * @param {string} segmentId * @param {string} rid @@ -129240,6 +129575,8 @@ Recommended fix: SegmentCollection.prototype.addSegmentChild = function (segmentId, rid, dataId) { let segment = this._segments[segmentId]; if (segment && !segment.isSubSegment()) { + // If a segment becomes a child of other segment, then the segment order needs to be recalculated + this._invalidateSegmentOrder(rid); return segment.addChild(rid, dataId); } return false; @@ -129253,11 +129590,14 @@ Recommended fix: SegmentCollection.prototype.addSegmentChildren = function (segmentId, rids, dataIds) { let segment = this._segments[segmentId]; if (segment && !segment.isSubSegment()) { + // If a segment becomes a child of other segment, then the segment order needs to be recalculated + this._invalidateSegmentOrder(rids); return segment.addChildren(rids, dataIds); } return false; }; - /** @public + /** This only works for immediate children of the specified segment + * @public * @param {string} segmentId * @param {string} rid * @return {boolean} Returns true if there is any change. Otherwise, returns false @@ -129277,6 +129617,7 @@ Recommended fix: SegmentCollection.prototype.removeSegmentChild = function (segmentId, rid) { let segment = this._segments[segmentId]; if (segment) { + this._invalidateSegmentOrder(rid); return segment.removeChild(rid); } return false; @@ -129289,6 +129630,7 @@ Recommended fix: SegmentCollection.prototype.removeSegmentChildren = function (segmentId, rids) { let segment = this._segments[segmentId]; if (segment) { + this._invalidateSegmentOrder(rids); return segment.removeChildren(rids); } return false; @@ -129307,6 +129649,7 @@ Recommended fix: } } if (dirty) { + this._segmentList = null; // WARNING: not optimized this.classify(null); } return dirty; @@ -129363,10 +129706,14 @@ Recommended fix: }; /** @public * @param {Array.} rids + * @param {boolean=} useCache=false If this is true, skip the calculation when there is already a cache for segment order */ - SegmentCollection.prototype.calcSegmentOrder = function (rids) { + SegmentCollection.prototype.calcSegmentOrder = function (rids, useCache) { let segmentList = this._segmentList; if (segmentList) { + if (useCache) { + return; // Use previous cache for segment order + } segmentList.length = 0; } else { segmentList = this._segmentList = []; @@ -129379,9 +129726,10 @@ Recommended fix: let rid = rids[i]; let segment = segmentSeparators[rid]; if (segment) { - if (!segment.isSubSegment()) { + if (segment.isRootSegment()) { this._segmentList.push(segment); segment.setOrder(++order); // WARNING: Segments and sub segments start with 1 + segment.updateTreeStructure(0); } if (--segmentCount <= 0) { break; @@ -129405,7 +129753,7 @@ Recommended fix: let prevSegment = null; let segmentValues = new Array(rowCount); let segmentVal = 0; - let highestVal = -10; + let highestVal = 0; let offset = 0; for (let r = 0; r < rowCount; ++r) { let rid = rids[r]; @@ -129414,7 +129762,7 @@ Recommended fix: // segment separator segmentVal = curSegment.getOrder() * 100; offset = 0; - if (!curSegment.isSubSegment()) { + if (curSegment.isRootSegment()) { if (prevSegment !== curSegment) { prevSegment = curSegment; highestVal = curSegment.getLastOrder() * 100; @@ -129428,12 +129776,15 @@ Recommended fix: segmentVal = curSegment.getOrder() * 100; offset = 1; if (partial) { + // This fixes the out of order sub segment highestVal = curSegment.getLastOrder() * 100; } } else { // row outside of segments if (highestVal) { - segmentVal = highestVal; + if (segmentVal < highestVal) { + segmentVal = highestVal; + } offset = 10; } else { segmentVal = offset = 0; @@ -129455,7 +129806,10 @@ Recommended fix: let segmentCount = segmentList.length; let lines = []; for (let i = 0; i < segmentCount; ++i) { - segmentList[i].log(lines); + let segment = segmentList[i]; + if (segment.isRootSegment()) { + segment.log(lines); + } } return lines.join("\n"); }; @@ -129464,10 +129818,14 @@ Recommended fix: */ SegmentCollection.prototype.logRowIdMap = function () { let lines = []; + let segmentSeparators = this._segments; let childToSegmentId = this._shared.childToSegment; for (let rid in childToSegmentId) { let segmentId = childToSegmentId[rid]; - lines.push(rid + " > " + segmentId); + let segment = segmentSeparators[segmentId]; + if (!segment || !segment.isSubSegment()) { + lines.push(rid + " > " + segmentId); + } } return lines.join("\n"); }; @@ -130566,63 +130924,65 @@ Recommended fix: this._segments.addEventListener("subSegmentChanged", this._onSubSegmentChanged); } }; - /** + /** Add or remove all segments from the given row ids * @public * @param {Array.} rids * @param {boolean=} enabled * @return {boolean} Return true if there is any change */ DataTable.prototype.setSegmentSeparators = function (rids, enabled) { - let change = false; - if (rids) { - let len = rids.length; - let segmentChanged = false; - for (let i = 0; i < len; i++) { - if (enabled !== false) { - let rid = rids[i]; - this._initSegmentCollection(); - if (this._autoSegmentFilling) { - let parentId = this._segments.getParentRowId(rid); - if (parentId) { - this._segments.removeSegmentChild(parentId, rid); - } + if (!rids) { + return false; + } + let adding = enabled !== false; + let segmentAdded = 0; + let segmentRemoved = 0; + let len = rids.length; + for (let i = 0; i < len; i++) { + let rid = rids[i]; + if (adding) { + this._initSegmentCollection(); + if (this._autoSegmentFilling) { + let parentId = this._segments.getParentRowId(rid); + if (parentId) { + this._segments.removeSegmentChild(parentId, rid); } - segmentChanged = this._segments.addSegment(rid); - } else if (this._segments) { - // remove case - let segment = this._segments.getSegment(rid); - if (segment) { - if (this._segments.removeSegment(rid)) { - change = true; - if (!this._segments.getSegmentCount()) { - this._segments = null; - } + } + segmentAdded |= this._segments.addSegment(rid); + } else if (this._segments) { + // Removing + let segment = this._segments.getSegment(rid); + if (segment) { + if (this._segments.removeSegment(rid)) { + segmentRemoved = 1; + if (!this._segments.getSegmentCount()) { + this._segments = null; } } } } - if (enabled !== false && segmentChanged) { - this._segments.calcSegmentOrder(this._rids); - change = true; - } - if (change) { - this.dispatchGlobalChange(); - } } - return change; + if (segmentAdded) { + this._segments.calcSegmentOrder(this._rids); + } + let changed = segmentAdded || segmentRemoved; + if (changed && this._needFiring()) { + this.dispatchGlobalChange(); + } + return changed ? true : false; }; /** * @public * @param {string} rid - * @param {boolean=} enabled + * @param {*=} options=null Segment options. If the value is false, segment separator will be stripped off from the given rid * @return {boolean} Return true if there is any change */ - DataTable.prototype.setSegmentSeparator = function (rid, enabled) { + DataTable.prototype.setSegmentSeparator = function (rid, options) { let change = false; let memberCount = 0; if (rid && typeof rid === "string") { - if (enabled !== false) { + if (options !== false) { this._initSegmentCollection(); if (this._autoSegmentFilling) { let parentId = this._segments.getParentRowId(rid); @@ -130630,12 +130990,13 @@ Recommended fix: this._segments.removeSegmentChild(parentId, rid); } } - if (this._segments.addSegment(rid)) { + let children = options && options["children"] ? options["children"] : null; + if (this._segments.addSegment(rid, children)) { this._segments.calcSegmentOrder(this._rids); change = true; } } else if (this._segments) { - // mean remove separator + // Remove the separator let segment = this._segments.getSegment(rid); if (segment) { memberCount = segment.getChildCount(); @@ -130829,6 +131190,20 @@ Recommended fix: } return false; }; + /** @private + * @param {boolean=} adding This indicates that segment is changed by adding a new child + */ + DataTable.prototype._onSegmentChildChanged = function (adding) { + if (this._segments) { + this._segments.calcSegmentOrder(this._rids, true); + } + if (adding !== false) { + this._sort(null); + } + this._dispatchPositionChange(); // Force rerendering, even if there is no position change + + this.requestClassifying(); + }; /** @public * @param {string} segmentId Row id * @param {string} rid Row id @@ -130839,10 +131214,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.addSegmentChild(segmentId, rid, dataId); if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } } @@ -130858,17 +131230,15 @@ Recommended fix: if (this._segments) { let dirty = this._segments.addSegmentChildren(segmentId, rids, dataIds); if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } } return false; }; - /** @public + /** Deprecated. Remove all existing children and add new children according to the give array + * @public * @param {Array.} segmentArr Segment array that contain "segmentId", "rowIds" to set segment children * @return {boolean} Return true if there is any change */ @@ -130876,20 +131246,16 @@ Recommended fix: if (!this._segments) { return false; } - this.removeAllSegmentChildren(); + let dirty = this._segments.removeAllSegmentChildren(); let len = segmentArr.length; - let dirty; for (let i = 0; i < len; i++) { let obj = segmentArr[i]; - if (this._segments.addSegmentChildren(obj.segmentId, obj.rowIds)) { + if (this._segments.addSegmentChildren(obj["segmentId"], obj["rowIds"])) { dirty = true; } } if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } return false; @@ -130903,8 +131269,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeSegmentChild(segmentId, rid); if (dirty) { - this.dispatchGlobalChange(); - this.requestClassifying(); + this._onSegmentChildChanged(false); } return dirty; } @@ -130919,8 +131284,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeSegmentChildren(segmentId, rids); if (dirty) { - this.dispatchGlobalChange(); - this.requestClassifying(); + this._onSegmentChildChanged(false); } return dirty; } @@ -130933,7 +131297,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeAllSegmentChildren(); // This immediately remove all sub segments if (dirty) { - this.dispatchGlobalChange(); + this._onSegmentChildChanged(false); } return dirty; } @@ -152380,13 +152744,13 @@ Recommended fix: } return false; }; - /** Set visible row as segment separator (hidden or filtered rows cannot be a segment separator) + /** Set visible row as a segment separator (hidden or filtered rows cannot be a segment separator) * @public * @param {string|number} rowRef Row id or row index - * @param {boolean=} enabled + * @param {*=} options=null Segment options. If the value is false, segment separator will be stripped off from the given rid * @return {boolean} Return true if there is any change */ - DataView_DataView.prototype.setSegmentSeparator = function (rowRef, enabled) { + DataView_DataView.prototype.setSegmentSeparator = function (rowRef, options) { let rowId = ""; if (typeof rowRef === "number") { rowId = this.getRowId(rowRef); @@ -152394,12 +152758,12 @@ Recommended fix: rowId = rowRef; // WARNING: Invisible row id can still be set as segment separator as long as it is in the data table } if (rowId) { - enabled = enabled !== false; - if (enabled) { + if (options !== false) { + // undefined, null, object, or true value this.synchronizeRowOrder(); } // TODO: Force expanding of segment before unsetting segment separator - return this._dt.setSegmentSeparator(rowId, enabled); + return this._dt.setSegmentSeparator(rowId, options); } return false; }; @@ -157151,7 +157515,7 @@ Recommended fix: * @return {string} */ Core.getVersion = function () { - return "5.1.137"; + return "5.1.139"; }; /** {@link ElementWrapper#dispose} * @override @@ -171896,7 +172260,7 @@ Recommended fix: ; // CONCATENATED MODULE: ./public/lib/grid/index.js window.EFX_GRID = { - version: "6.0.146" + version: "6.0.149" }; ; // CONCATENATED MODULE: ./public/lib/grid/themes/halo/dark/efx-grid.js @@ -179801,7 +180165,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.nativeStyles.define', { detail: { name: 'html', - styles: 'html{height:100%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;--color-scheme-primary:#334BFF;--color-scheme-secondary:#6678FF;--color-scheme-tertiary:#333333;--color-scheme-complementary:#FFFFFF;--color-scheme-negative:#F5475B;--color-scheme-neutral:#CCCCCC;--color-scheme-positive:#39C46E;--color-scheme-tickup:#39C46E;--color-scheme-tickdown:#F5475B;--color-scheme-ticktext:#0D0D0D;--theme-name:\'halo-theme\';--theme-version:\'6.8.0\'}html[movement-color-profile=asian1]{--color-scheme-negative:#39C46E;--color-scheme-neutral:#CCCCCC;--color-scheme-positive:#F5475B;--color-scheme-tickup:#F5475B;--color-scheme-tickdown:#39C46E}html[movement-color-profile=asian2]{--color-scheme-negative:#F5475B;--color-scheme-neutral:#39C46E;--color-scheme-positive:#00D0D4;--color-scheme-tickup:#FFC800;--color-scheme-tickdown:#F5475B}html[movement-color-profile=european]{--color-scheme-negative:#F5475B;--color-scheme-neutral:#39C46E;--color-scheme-positive:#00D0D4;--color-scheme-tickup:#39C46E;--color-scheme-tickdown:#F5475B}::-moz-selection{color:#fff;background:#334bff}::selection{color:#fff;background:#334bff}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}@supports not selector(::-webkit-scrollbar){html{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin;scrollbar-width:auto}}' + styles: 'html{height:100%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;scrollbar-face-color:#595959;scrollbar-shadow-color:#595959;scrollbar-highlight-color:#595959;scrollbar-arrow-color:#595959;scrollbar-track-color:#1a1a1a;scrollbar-3dlight-color:#1a1a1a;scrollbar-darkshadow-color:#1a1a1a;--color-scheme-primary:#334BFF;--color-scheme-secondary:#6678FF;--color-scheme-tertiary:#333333;--color-scheme-complementary:#FFFFFF;--color-scheme-negative:#F5475B;--color-scheme-neutral:#CCCCCC;--color-scheme-positive:#39C46E;--color-scheme-tickup:#39C46E;--color-scheme-tickdown:#F5475B;--color-scheme-ticktext:#0D0D0D;--theme-name:\'halo-theme\';--theme-version:\'6.8.1\'}html[movement-color-profile=asian1]{--color-scheme-negative:#39C46E;--color-scheme-neutral:#CCCCCC;--color-scheme-positive:#F5475B;--color-scheme-tickup:#F5475B;--color-scheme-tickdown:#39C46E}html[movement-color-profile=asian2]{--color-scheme-negative:#F5475B;--color-scheme-neutral:#39C46E;--color-scheme-positive:#00D0D4;--color-scheme-tickup:#FFC800;--color-scheme-tickdown:#F5475B}html[movement-color-profile=european]{--color-scheme-negative:#F5475B;--color-scheme-neutral:#39C46E;--color-scheme-positive:#00D0D4;--color-scheme-tickup:#39C46E;--color-scheme-tickdown:#F5475B}::-moz-selection{color:#fff;background:#334bff}::selection{color:#fff;background:#334bff}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}@supports not selector(::-webkit-scrollbar){html{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin;scrollbar-width:auto}}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/halo-theme/dark/input.js diff --git a/resources/elf-halo-light.js b/resources/elf-halo-light.js index 79312a00..d3613801 100644 --- a/resources/elf-halo-light.js +++ b/resources/elf-halo-light.js @@ -10412,6 +10412,14 @@ Potential causes: * combo-box when parent container handles element states. */ this.transparent = false; + /** + * Show clears button + */ + this.clears = false; + /** + * Internal reference to clears button + */ + this.clearsButtonRef = (0, ref /* createRef */._)(); /** * A reference to input element */ @@ -10438,6 +10446,12 @@ Potential causes: static get observedAttributes() { return Array.from(new Set([...super.observedAttributes, ...ObservedAriaLabel, ...ObservedAriaDescription, ...ObservedAriaRequired])); } + /** + * Get an input element + */ + get clearsButton() { + return this.clearsButtonRef.value; + } /** * Get an input element */ @@ -10661,6 +10675,46 @@ Potential causes: setSelectionRange(startSelection, endSelection, selectionDirection) { this.inputElement?.setSelectionRange(startSelection, endSelection, selectionDirection); } + /** + * Template for clear button + * Rendered when `clears` attribute is set + * @returns Popup template or undefined + */ + get clearButtonTemplate() { + if (this.hasClear) { + return (0, lit /* html */.qy)` + + `; + } + return lit /* nothing */.s6; + } + /** + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event + * @returns {void} + */ + onClearsButtonTap(event) { + this.setValueAndNotify(''); + // Some form control elements, such as Tree Select, display/hide an overlay upon selection. + // PreventDefault() ensures that selecting the clear button would not change overlay state. + event.preventDefault(); + } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); // shouldn't display clear if disabled or readonly + return this.clears && editable && !!this.value; + } } (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, @@ -10677,6 +10731,9 @@ Potential causes: type: Boolean, reflect: true })], FormFieldElement.prototype, "transparent", void 0); + (0, tslib_es6.__decorate)([(0, property /* property */.M)({ + type: Boolean + })], FormFieldElement.prototype, "clears", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaLabel", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaDescription", void 0); (0, tslib_es6.__decorate)([(0, state /* state */.w)()], FormFieldElement.prototype, "inputAriaRequired", void 0); @@ -12830,7 +12887,7 @@ Recommended fix: /* harmony export */x: () => ( /* binding */VERSION) /* harmony export */ }); - const VERSION = '6.17.2'; + const VERSION = '6.18.0'; /***/ }), @@ -19529,7 +19586,7 @@ Recommended fix: var proto = $Number.prototype; // Opera ~12 has broken Object#toString var BROKEN_COF = cof(__webpack_require__(4719)(proto)) == NUMBER; - var TRIM = ('trim' in String.prototype); + var TRIM = 'trim' in String.prototype; // 7.1.3 ToNumber(argument) var toNumber = function (argument) { @@ -38890,6 +38947,7 @@ Recommended fix: * @property {string=} rowSpanningField="ROW_SPANNING" Field to be used for spanning segment header rows based on the field values * @property {string=} segmentIdField="" Field used for initializing segments based on text id * @property {string=} collapsingField="" Field used for indicating that the corresponding segment row is collapsed + * @property {string=} parentIdField="" Field used for specifying parent segment of the row * @property {boolean=} defaultCollapsing=false If enabled, any newly created segment will be collapsed by default * @property {(string|number)=} displayColumn=null Render tags in the given column. It can be either the column index, column ID, or field */ @@ -38976,6 +39034,10 @@ Recommended fix: * @private */ RowSegmentingPlugin.prototype._collapsingField = ""; + /** @type {string} + * @private + */ + RowSegmentingPlugin.prototype._parentIdField = ""; /** @type {number} * @private */ @@ -39104,17 +39166,25 @@ Recommended fix: let separatorArr = []; let collapsingAry = []; let expandingAry = []; + let parentId = ""; for (let i = 0; i < rowCount; i++) { rowId = rowIds[i]; rowData = this._rowGetter(dt.getRowData(rowId)); segmentId = rowData[this._segmentIdField]; - if (segmentId == null) { + parentId = rowData[this._parentIdField]; + if (segmentId == null && parentId == null) { continue; } + this._prevSegmentBySegmentId = true; let segmentInfo = segmentMap[segmentId]; + let parentInfo = parentId !== segmentId ? segmentMap[parentId] : null; // WARNING: parent must exist beforehand if (segmentInfo) { + if (parentInfo) { + segmentInfo = parentInfo; + parentInfo = null; + } segmentInfo.rowIds.push(rowId); - } else { + } else if (segmentId) { segmentInfo = segmentMap[segmentId] = { rowIds: [], segmentId: rowId @@ -39130,7 +39200,9 @@ Recommended fix: } } } - this._prevSegmentBySegmentId = true; + if (parentInfo) { + parentInfo.rowIds.push(rowId); + } } if (segmentArr.length) { this.setSegmentSeparators(separatorArr); // TODO: This method can be merged into setSegmentChildren @@ -39198,6 +39270,9 @@ Recommended fix: if (option.collapsingField != null) { this._collapsingField = option.collapsingField; } + if (option.parentIdField != null) { + this._parentIdField = option.parentIdField; + } if (option.predefinedColors != null && typeof option.predefinedColors === "object") { this._predefinedColors = option.predefinedColors; } @@ -39276,6 +39351,9 @@ Recommended fix: if (this._collapsingField) { extOptions.collapsingField = this._collapsingField; } + if (this._parentIdField) { + extOptions.parentIdField = this._parentIdField; + } if (this._defaultCollapsing) { extOptions.defaultCollapsing = true; } @@ -39302,6 +39380,32 @@ Recommended fix: return obj; }; + /** @private + * @function + * @param {!Object} obj + * @param {string} field + * @param {*} val + */ + let _setObjectValue = function (obj, field, val) { + if (field) { + if (!obj.values) { + obj.values = {}; + } + obj.values[field] = val; + } + }; + /** @private + * @function + * @param {!Object} obj + * @param {string} field + */ + let _deleteObjectValue = function (obj, field) { + if (field && obj.values) { + if (obj.values[field]) { + delete obj.values[field]; // Slow + } + } + }; /** @public * @param {Object} rowData row config object * @param {string} rowId @@ -39309,34 +39413,32 @@ Recommended fix: */ RowSegmentingPlugin.prototype.getRowConfigObject = function (rowData, rowId) { let obj = rowData || {}; - if (!this._segmentIdField) { + let segmentIdField = this._segmentIdField; + if (!segmentIdField) { return obj; } - if (obj.values) { - if (obj.values[this._segmentIdField]) { - delete obj.values[this._segmentIdField]; // clear only segmentIdField - } - } - if (this.isSegmentSeparator(rowId)) { - if (!obj.values) { - obj.values = {}; - } - obj.values[this._segmentIdField] = ++this._runningId; - let collapsed = this.isSegmentCollapsed(rowId); - if (this._collapsingField) { - obj.values[this._collapsingField] = collapsed; - } + _deleteObjectValue(obj, segmentIdField); + _deleteObjectValue(obj, this._parentIdField); + let dv = this._getDataView(); + let segment = dv.getSegment(rowId); + if (segment) { + _setObjectValue(obj, segmentIdField, ++this._runningId); + segment.runningId = this._runningId; // WANRING: Add + + let collapsed = segment.isCollapsed(); + _setObjectValue(obj, this._collapsingField, collapsed); if (obj["collapsed"] == null) { // Avoid overriding value from real-time grid obj["collapsed"] = collapsed; } - } else { - let parentId = this.getSegmentParentRowId(rowId); - if (parentId) { - if (!obj.values) { - obj.values = {}; - } - obj.values[this._segmentIdField] = this._runningId; + } + let parentSegment = dv.getSegmentParent(rowId); + if (parentSegment) { + if (this._parentIdField) { + // WARNING: this assumes the parent segment is always appeared before this row id + _setObjectValue(obj, this._parentIdField, parentSegment.runningId || this._runningId); + } else if (!segment) { + _setObjectValue(obj, segmentIdField, this._runningId); } } return obj; @@ -39446,12 +39548,8 @@ Recommended fix: RowSegmentingPlugin.prototype.getSegmentParentRowId = function (rowRef) { let dv = this._getDataView(); if (dv) { - let rowId = ""; - if (typeof rowRef === "number") { - rowId = dv.getRowId(rowRef); // WARNING: This is very slow - } else { - rowId = rowRef; - } + // WARNING: getRowId is slow + let rowId = typeof rowRef === "number" ? dv.getRowId(rowRef) : rowRef; return dv.getSegmentParentRowId(rowId); } return ""; @@ -39550,9 +39648,10 @@ Recommended fix: } else { arg.groupLevel = 0; let indentLevel = 0; - let parentId = this.getSegmentParentRowId(rowId); + let parentId = dv.getSegmentParentRowId(rowId); if (parentId) { - indentLevel = 1; // TODO: Provide a way for segmenting multiple levels. Currently, just one level is supported. + let parentSegment = dv.getSegment(parentId); + indentLevel = parentSegment ? parentSegment.getSegmentLevel() + 1 : 1; arg.nonGroupRow = false; let parentRowData = parentRows[parentId]; if (!parentRowData) { @@ -95956,6 +96055,9 @@ Recommended fix: * @attr {string} placeholder - Set placeholder text * @prop {string} [placeholder=""] - Set placeholder text * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button + * * @fires value-changed - Fired when the user commits a value change. The event is not triggered if `value` property is changed programmatically. * @fires query-changed - Fired when the user changes value in the input to change a query word. If `query-debounce-rate` is set, this event will be triggered after debounce completion. The event is not triggered if `query` property is changed programmatically. * @fires opened-changed - Fired when the user opens or closes control's popup. The event is not triggered if `opened` property is changed programmatically. @@ -95978,10 +96080,6 @@ Recommended fix: * Track opened state of popup */ this.opened = false; - /** - * Show clears button - */ - this.clears = false; this._freeText = false; /** * Set error state @@ -96739,8 +96837,8 @@ Recommended fix: return; } const path = event.composedPath(); - if (this.clearsButtonEl && path.includes(this.clearsButtonEl)) { - this.onClearsButtonTap(); + if (this.clearsButton && path.includes(this.clearsButton)) { + // clear button uses tap event from FormField instead so no-op here return; } if (path.includes(this.toggleButtonEl)) { @@ -96761,15 +96859,15 @@ Recommended fix: } } /** - * Run when tap event happens on clears button + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event * @returns {void} */ - onClearsButtonTap() { - this.freeTextValue = ''; - this.inputText = ''; + onClearsButtonTap(event) { this.setQuery(''); - this.setValueAndNotify(''); - this.openOnFocus(); + super.onClearsButtonTap(event); + this.inputText = ''; + this.inputElement?.focus(); } /** * Run when tap event happens on input wrapper @@ -96903,21 +97001,6 @@ Recommended fix: } return keyboardEvent; } - /** - * Template for clear button - * Rendered when `clears` attribute is set - * @returns Popup template or undefined - */ - get clearButtonTemplate() { - const hasText = this.label || this.query || this.freeTextValue || this.inputText; - if (this.clears && hasText) { - return (0, core_lib /* html */.qy)` -
- -
- `; - } - } /** * Template for selection badge in multiple mode * @returns Selection badge template or undefined @@ -97009,6 +97092,14 @@ Recommended fix: 'aria-activedescendant': this.highlightedItemValue }; } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); + return !!(this.clears && editable && (this.value || this.inputText || this.freeTextValue)); + } /** * Returns a template for input field * @returns Input template @@ -97043,9 +97134,6 @@ Recommended fix: type: Boolean, reflect: true })], ComboBox.prototype, "opened", void 0); - (0, tslib_es6.__decorate)([(0, property /* property */.M)({ - type: Boolean - })], ComboBox.prototype, "clears", void 0); (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, attribute: 'free-text' @@ -97078,7 +97166,6 @@ Recommended fix: })], ComboBox.prototype, "query", null); (0, tslib_es6.__decorate)([query_i('#internal-list')], ComboBox.prototype, "listEl", void 0); (0, tslib_es6.__decorate)([query_i('#toggle-button')], ComboBox.prototype, "toggleButtonEl", void 0); - (0, tslib_es6.__decorate)([query_i('#clears-button')], ComboBox.prototype, "clearsButtonEl", void 0); (0, tslib_es6.__decorate)([(0, property /* property */.M)({ type: Boolean, reflect: true @@ -97125,7 +97212,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-combo-box', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;color:#404040;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;padding:0}:host([disabled]){border:1px solid rgba(89,89,89,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #b63243}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host(:not([readonly])[focused]),:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host([readonly]){cursor:default}:host [part=placeholder]{opacity:.5;opacity:.7}:host [part=label],:host [part=placeholder]{margin-right:3px}:host [part~=icon]{color:#404040;opacity:.7}:host(:not([readonly]):hover) [part~=icon],:host(:not([readonly])[focused]) [part~=icon]{opacity:1}:host(:not([readonly])[focused]) [part~=icon]{color:#334bff}:host([disabled]) [part~=icon]{color:rgba(89,89,89,.5)}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height)}:host [part~=input-wrapper]{touch-action:manipulation;display:flex;align-items:center;width:100%;height:100%}:host [part~=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;text-overflow:ellipsis;border:1px solid #595959;width:100%;background:0 0;border:none;padding:0 8px}:host [part~=input][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host [part~=input][type=number]{padding-right:0}:host [part~=input][warning]{border:1px solid #cca000}:host [part~=input][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host [part~=input][error],:host [part~=input][error][warning]{border:1px solid #b63243}:host [part~=input][error][disabled],:host [part~=input][error][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host [part~=input] ::-ms-clear{display:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;flex:none;height:100%;width:24px}:host [part~=list]{display:flex;flex-flow:column nowrap}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host [part~=list] ::slotted(ef-list){max-height:inherit}}:host [part=selection-badge]{flex-shrink:0}:host([disabled]) [part~=selection-badge]{opacity:.4}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host([warning]){border-color:#cca000}:host([error]),:host([error][warning]){border-color:#d94255}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([disabled]){color:rgba(64,64,64,.5);border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host(:not([readonly])[focused]),:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}:host [part~=input-wrapper]{border-left-color:inherit}:host [part~=button-toggle]{border-left:1px solid #595959;border-left-color:inherit}:host [part~=button-toggle]::before{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;width:24px;border:1px solid transparent}:host(:not([readonly])) [part~=button-clear]:hover{color:#334bff}:host(:not([readonly]):hover) [part~=button-toggle]{color:#334bff}:host(:not([readonly])[focused]) [part~=button-toggle]{border-left-color:#334bff;color:#334bff}:host(:not([readonly])) [part~=button-toggle]:hover{border-left-color:#334bff;color:#fff;background:#1429bd}:host(:not([readonly])) [part~=button-toggle]:hover::after{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid #334bff;pointer-events:none}:host(:not([readonly])) [part~=button-toggle]:active{background:#0f1e8a}:host(:not([readonly])) [part~=button]:active{color:#fff}:host(:not([readonly])) [part~=icon]{color:inherit!important}:host([disabled]) [part~=input]{border:none}:host([disabled]) [part~=button-toggle],:host([readonly]) [part~=button-toggle]{border-left-color:rgba(89,89,89,.5)}:host([readonly]) [part~=button-toggle]{color:rgba(64,64,64,.5);cursor:default}:host([focused][readonly]) [part~=button-toggle]{border-left-color:#334bff}:host [part=list] ::slotted(ef-list){display:block}:host [part=list] ef-list-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;color:#404040;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;padding:0}:host([disabled]){border:1px solid rgba(89,89,89,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #b63243}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host(:not([readonly])[focused]),:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host([readonly]){cursor:default}:host [part=placeholder]{opacity:.5;opacity:.7}:host [part=label],:host [part=placeholder]{margin-right:3px}:host [part~=icon]{color:#404040;opacity:.7}:host(:not([readonly]):hover) [part~=icon],:host(:not([readonly])[focused]) [part~=icon]{opacity:1}:host(:not([readonly])[focused]) [part~=icon]{color:#334bff}:host([disabled]) [part~=icon]{color:rgba(89,89,89,.5)}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height)}:host [part~=input-wrapper]{touch-action:manipulation;display:flex;align-items:center;width:100%;height:100%}:host [part~=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;text-overflow:ellipsis;border:1px solid #595959;width:100%;background:0 0;border:none;padding:0 8px}:host [part~=input][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host [part~=input][type=number]{padding-right:0}:host [part~=input][warning]{border:1px solid #cca000}:host [part~=input][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host [part~=input][error],:host [part~=input][error][warning]{border:1px solid #b63243}:host [part~=input][error][disabled],:host [part~=input][error][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host [part~=input] ::-ms-clear{display:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;flex:none;height:100%;width:24px}:host [part~=list]{display:flex;flex-flow:column nowrap}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){:host [part~=list] ::slotted(ef-list){max-height:inherit}}:host [part=selection-badge]{flex-shrink:0}:host([disabled]) [part~=selection-badge]{opacity:.4}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]){border-color:#cca000}:host([error]),:host([error][warning]){border-color:#d94255}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([disabled]){color:rgba(64,64,64,.5);border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host(:not([readonly])[focused]),:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}:host [part~=input-wrapper]{border-left-color:inherit}:host [part~=button-toggle]{border-left:1px solid #595959;border-left-color:inherit}:host [part~=button-toggle]::before{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;width:24px;border:1px solid transparent}:host(:not([readonly]):hover) [part~=button-toggle]{color:#334bff}:host(:not([readonly])[focused]) [part~=button-toggle]{border-left-color:#334bff;color:#334bff}:host(:not([readonly])) [part~=button-toggle]:hover{border-left-color:#334bff;color:#fff;background:#1429bd}:host(:not([readonly])) [part~=button-toggle]:hover::after{content:\'\';display:block;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid #334bff;pointer-events:none}:host(:not([readonly])) [part~=button-toggle]:active{background:#0f1e8a}:host(:not([readonly])) [part~=button]:active{color:#fff}:host(:not([readonly])) [part~=icon]{color:inherit!important}:host(:not([readonly])) [part~=button-clear]:active,:host(:not([readonly])) [part~=button-clear]:hover{color:#334bff}:host([disabled]) [part~=input]{border:none}:host([disabled]) [part~=button-toggle],:host([readonly]) [part~=button-toggle]{border-left-color:rgba(89,89,89,.5)}:host([readonly]) [part~=button-toggle]{color:rgba(64,64,64,.5);cursor:default}:host([focused][readonly]) [part~=button-toggle]{border-left-color:#334bff}:host [part=list] ::slotted(ef-list){display:block}:host [part=list] ef-list-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/dialog/draggable-element.js @@ -97749,6 +97836,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let NumberField = class NumberField extends core_lib /* FormFieldElement */.x3 { constructor() { @@ -98494,7 +98584,7 @@ Recommended fix: * @return {TemplateResult} Render template */ render() { - return (0, core_lib /* html */.qy)` ${super.render()} ${this.noSpinner ? null : this.renderSpinner()}`; + return (0, core_lib /* html */.qy)` ${super.render()} ${this.clearButtonTemplate} ${this.noSpinner ? null : this.renderSpinner()}`; } }; (0, tslib_es6.__decorate)([(0, property /* property */.M)({ @@ -98525,7 +98615,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-number-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=input]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}:host [part=spinner-down],:host [part=spinner-up]{line-height:0;min-width:22px;color:#404040}:host [part=spinner]{height:100%;margin-left:8px;border-left:inherit;border-color:inherit}:host(:not([no-spinner])){padding:0 0 0 8px}:host([transparent]),:host([transparent]) [part=spinner]{border:none}:host(:hover:not([readonly])) [part=spinner-down],:host(:hover:not([readonly])) [part=spinner-up]{color:#334bff}:host(:hover:not([readonly])) [part=spinner-down]:hover,:host(:hover:not([readonly])) [part=spinner-up]:hover{color:#fff;background-color:#1429bd}:host(:hover:not([readonly])) [part=spinner-down]:active,:host(:hover:not([readonly])) [part=spinner-up]:active{color:#fff;background:#0f1e8a}:host(:not([transparent]):not([readonly])) [part=spinner]:hover{border-left-color:#334bff!important;border-left-style:solid!important}:host(:not([transparent]):not([readonly])) [part=spinner]:hover::after{content:\'\';border:1px solid #334bff;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;pointer-events:none}:host([focused]) [part=spinner-down],:host([focused]) [part=spinner-up]{color:#334bff}:host([disabled]) [part=spinner-down],:host([disabled]) [part=spinner-up],:host([readonly]:not([focused])) [part=spinner-down],:host([readonly]:not([focused])) [part=spinner-up]{color:rgba(64,64,64,.5)}:host([disabled][error]) [part=spinner],:host([readonly]:not([focused])[error]) [part=spinner]{border-color:rgba(238,172,180,.5)}:host([disabled][warning]) [part=spinner],:host([readonly]:not([focused])[warning]) [part=spinner]{border-color:rgba(255,233,153,.5)}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=input]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}:host [part=spinner-down],:host [part=spinner-up]{line-height:0;min-width:22px;color:#404040}:host [part=spinner]{height:100%;margin-left:8px;border-left:inherit;border-color:inherit}:host(:not([no-spinner])){padding:0 0 0 8px}:host([transparent]),:host([transparent]) [part=spinner]{border:none}:host(:hover:not([readonly])) [part=spinner-down],:host(:hover:not([readonly])) [part=spinner-up]{color:#334bff}:host(:hover:not([readonly])) [part=spinner-down]:hover,:host(:hover:not([readonly])) [part=spinner-up]:hover{color:#fff;background-color:#1429bd}:host(:hover:not([readonly])) [part=spinner-down]:active,:host(:hover:not([readonly])) [part=spinner-up]:active{color:#fff;background:#0f1e8a}:host(:not([transparent]):not([readonly])) [part=spinner]:hover{border-left-color:#334bff!important;border-left-style:solid!important}:host(:not([transparent]):not([readonly])) [part=spinner]:hover::after{content:\'\';border:1px solid #334bff;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;pointer-events:none}:host([focused]) [part=spinner-down],:host([focused]) [part=spinner-up]{color:#334bff}:host([disabled]) [part=spinner-down],:host([disabled]) [part=spinner-up],:host([readonly]:not([focused])) [part=spinner-down],:host([readonly]:not([focused])) [part=spinner-up]{color:rgba(64,64,64,.5)}:host([disabled][error]) [part=spinner],:host([readonly]:not([focused])[error]) [part=spinner]{border-color:rgba(238,172,180,.5)}:host([disabled][warning]) [part=spinner],:host([readonly]:not([focused])[warning]) [part=spinner]{border-color:rgba(255,233,153,.5)}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/pill/index.js @@ -99112,6 +99202,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let TextField = class TextField extends core_lib /* FormFieldElement */.x3 { constructor() { @@ -99330,7 +99423,7 @@ Recommended fix: * @return Render template */ render() { - return (0, core_lib /* html */.qy)` ${super.render()} ${this.renderIcon()} `; + return (0, core_lib /* html */.qy)` ${super.render()} ${this.clearButtonTemplate} ${this.renderIcon()} `; } }; (0, tslib_es6.__decorate)([(0, property /* property */.M)({ @@ -99398,6 +99491,9 @@ Recommended fix: * * @attr {string} value - Input's value * @prop {string} [value=""] - Input's value + * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button */ let SearchField = class SearchField extends TextField { /** @@ -99440,7 +99536,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-search-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/select/index.js @@ -100390,7 +100486,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=placeholder]{opacity:.7}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=placeholder]{opacity:.7}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/text-field/themes/halo/light/index.js @@ -100398,7 +100494,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-text-field', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host ::-ms-clear{display:none}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#404040;min-width:1em;margin-left:2px}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}' } })); ; // CONCATENATED MODULE: ./node_modules/lit/node_modules/lit-html/directives/guard.js @@ -119408,6 +119504,9 @@ Recommended fix: * @attr {string} placeholder - Set placeholder text default depends on format * @prop {string} [placeholder="dd-MMM-yyyy"] - Set placeholder text default depends on format * + * @attr {boolean} clears - Show clears button + * @prop {boolean} [clears=false] - Show clears button + * * @slot header - Slot to add custom contents at the top of popup * @slot right - Slot to add custom contents at the right of popup * @slot footer - Slot to add custom contents at the bottom of popup @@ -120078,6 +120177,8 @@ Recommended fix: } if (path.includes(this.iconEl)) { this.toggleOpened(); + } else if (this.clearsButton && path.includes(this.clearsButton)) { + this.onClearsButtonTap(event); } else if (!this.inputTriggerDisabled) { this.setOpened(true); } @@ -120204,6 +120305,45 @@ Recommended fix: this.submitInterimSegments(); this.validateInput(); } + /** + * Run when tap event happens on clears button and fire value-changed event. + * @param event tap event + * @returns {void} + */ + onClearsButtonTap(event) { + let values = []; + // When the element's input is cleared by typing, + // an array of empty string(s) will be assign to `values`. + // Clear button logic simply follows this behavior for consistency. + // TODO: `values` should be set to an empty array once the input has been cleared. + if (this.inputFromEl && this.inputToEl) { + // range mode + this.inputFromEl.value = ''; + this.inputToEl.value = ''; + values = ['', '']; + } else if (this.inputEl) { + // single mode + this.inputEl.value = ''; + values = ['']; + } + this.notifyValuesChange(values); + this.inputValues = values; + this.resetViews(); + // `validateInput()` and `requestUpdate()` for the case that there is no `values` change. + this.validateInput(); + this.requestUpdate(); + // PreventDefault() ensures that selecting the clear button would not change `opened` state. + event.preventDefault(); + } + /** + * Returns a condition to show clear button + * @returns True if clear button will show + */ + get hasClear() { + const editable = !(this.readonly || this.disabled); // shouldn't display clear if disabled or readonly + const hasInputValue = this.range ? !!this.inputValues[0] || !!this.inputValues[1] : !!this.inputValues[0]; + return this.clears && editable && hasInputValue; + } /** * Check if input format conforms to value format * @returns true if valid format @@ -120461,7 +120601,7 @@ Recommended fix:
${this.getInputTemplate(this.range ? INPUT_FROM_ID : INPUT_ID, values[0])} ${this.range ? (0, core_lib /* html */.qy)`
` : undefined} - ${this.range ? this.getInputTemplate(INPUT_TO_ID, values[1]) : undefined} + ${this.range ? this.getInputTemplate(INPUT_TO_ID, values[1]) : undefined} ${this.clearButtonTemplate}
`; } @@ -120618,7 +120758,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-datetime-picker', - styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;line-height:24px}:host([disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #b63243}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=time-picker]{margin:0}:host [part=timepicker-wrapper]{box-shadow:inset 0 1px 0 0 #d9d9d9;box-shadow:none;padding:0 3px 4px}:host([range]) ef-text-field{text-align:center}:host [part=input]{color:inherit}:host [part=input-separator]{line-height:24px;background:#0d0d0d;width:.4em;margin:auto 0;height:1px}:host [part=calendar]{width:196px;padding:4px 3px}:host [part=list]{margin-top:2px;border:1px solid #334bff;background-color:#f2f2f2}:host([range]){width:304px}:host [part=icon]{color:#595959}:host([warning]:not([focused])){border-color:#cca000}:host([error]:not([focused])){border-color:#d94255}:host([warning]:hover:not([readonly]):not([focused])){border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])){border-color:rgba(238,172,180,.5)}:host([disabled]) [part=icon]{color:rgba(64,64,64,.5)}:host(:not([disabled]):not([error]):not([warning]):hover) [part=icon],:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}' + styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;line-height:24px}:host([disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #b63243}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=time-picker]{margin:0}:host [part=timepicker-wrapper]{box-shadow:inset 0 1px 0 0 #d9d9d9;box-shadow:none;padding:0 3px 4px}:host([range]) ef-text-field{text-align:center}:host [part=input]{color:inherit}:host [part=input-separator]{line-height:24px;background:#0d0d0d;width:.4em;margin:auto 0;height:1px}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host [part=calendar]{width:196px;padding:4px 3px}:host [part=list]{margin-top:2px;border:1px solid #334bff;background-color:#f2f2f2}:host([range]){width:304px}:host [part=icon]{color:#595959}:host([warning]:not([focused])){border-color:#cca000}:host([error]:not([focused])){border-color:#d94255}:host([warning]:hover:not([readonly]):not([focused])){border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])){border-color:rgba(238,172,180,.5)}:host([disabled]) [part=icon]{color:rgba(64,64,64,.5)}:host(:not([disabled]):not([error]):not([warning]):hover) [part=icon],:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/pagination/index.js @@ -121149,7 +121289,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-pagination', - styles: ':host [part=container]{align-items:center;justify-content:flex-end}:host [part=label]{clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}:host [part=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;padding:0 8px;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;touch-action:manipulation;min-width:40px;text-align:center;width:150px;margin:0 1px}:host [part=input][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host [part=input][type=number]{padding-right:0}:host [part=input][warning]{border:1px solid #cca000}:host [part=input][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host [part=input][error],:host [part=input][error][warning]{border:1px solid #b63243}:host [part=input][error][disabled],:host [part=input][error][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host [part=input] ::-ms-clear{display:none}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:hover{border-color:#0d0d0d;color:#0d0d0d}:host [part=input]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=button]{touch-action:manipulation}:host{margin:1px 0}:host [part=input]::-moz-selection{color:#fff;background-color:#334bff}:host [part=input]::selection{color:#fff;background-color:#334bff}:host [part=buttons]{margin:0}' + styles: ':host [part=container]{align-items:center;justify-content:flex-end}:host [part=label]{clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}:host [part=input]{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:12px;font-weight:400;height:24px;max-width:100%;padding:0 8px;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;color:#404040;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;touch-action:manipulation;min-width:40px;text-align:center;width:150px;margin:0 1px}:host [part=input][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(89,89,89,.5)}:host [part=input][type=number]{padding-right:0}:host [part=input][warning]{border:1px solid #cca000}:host [part=input][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host [part=input][error],:host [part=input][error][warning]{border:1px solid #b63243}:host [part=input][error][disabled],:host [part=input][error][warning][disabled]{color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host [part=input] ::-ms-clear{display:none}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:hover{border-color:#0d0d0d;color:#0d0d0d}:host [part=input]:focus{background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=button]{touch-action:manipulation}:host{margin:1px 0}:host [part=input]::-moz-selection{color:#fff;background-color:#334bff}:host [part=input]::selection{color:#fff;background-color:#334bff}:host [part=buttons]{margin:0}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/elements/lib/overlay-menu/helpers/constants.js @@ -128183,7 +128323,7 @@ Recommended fix: */ let Segment_Segment = function (rid, sharedObj) { this._rid = rid; - this._children = {}; + this._childIds = []; this._shared = sharedObj; if (sharedObj.defaultCollapsing) { this._collapsed = true; @@ -128212,14 +128352,6 @@ Recommended fix: } return 0; }; - /** @private - * @function - * @param {Segment} segment - * @param {number} idx - */ - Segment_Segment._assignSubSegmentOrder = function (segment, idx) { - segment.setOrder(idx + 1); - }; /** @type {Object} * @private @@ -128230,14 +128362,14 @@ Recommended fix: * @private */ Segment_Segment.prototype._rid; - /** @type {!Object} + /** @type {!Array.} * @private */ - Segment_Segment.prototype._children; - /** @type {number} + Segment_Segment.prototype._childIds; + /** @type {Object} * @private */ - Segment_Segment.prototype._childCount = 0; + Segment_Segment.prototype._childDataIds = null; /** @type {boolean} * @private */ @@ -128246,6 +128378,14 @@ Recommended fix: * @private */ Segment_Segment.prototype._order = 0; + /** @type {number} + * @private + */ + Segment_Segment.prototype._offsetOrder = 0; + /** @type {number} + * @private + */ + Segment_Segment.prototype._depth = 0; /** @type {boolean} * @private */ @@ -128255,10 +128395,10 @@ Recommended fix: * @private */ Segment_Segment.prototype._subSegDef = null; - /** @type {number} + /** @type {boolean} * @private */ - Segment_Segment.prototype._subSegLevel = 0; + Segment_Segment.prototype._subSegment = false; // This indicates that the segment is autogenerated (subsegment) /** @type {Object.} * @private */ @@ -128266,7 +128406,7 @@ Recommended fix: /** @type {Array.} * @private */ - Segment_Segment.prototype._subSegNames = null; // For immediate sub-segment child names + Segment_Segment.prototype._subSegNames = null; // For immediate sub-segment child names/ids /** @type {string} * @private */ @@ -128275,10 +128415,6 @@ Recommended fix: * @private */ Segment_Segment.prototype._subSegVal; - /** @type {Segment} - * @private - */ - Segment_Segment.prototype._subSegParent = null; /** @public */ @@ -128298,13 +128434,12 @@ Recommended fix: this._subSegMap = this._subSegNames = null; } if (this._collapsed) { - if (this._childCount || this._subSegDef) { - this._shared.dirtyCollapsingState = true; - } + this.markCollapsingStateDirty(); } - this._childCount = 0; + this._childDataIds = null; + this._childIds.length = 0; this._shared = null; - this._subSegParent = this._subSegDef = this._subSegVal = null; + this._subSegDef = this._subSegVal = null; }; /** @public * @return {string} @@ -128316,10 +128451,17 @@ Recommended fix: * @return {string} */ Segment_Segment.prototype.getParentId = function () { - if (this._subSegParent) { - return this._subSegParent.getId(); + return this._shared.childToSegment[this._rid] || ""; + }; + /** @public + * @return {Segment} + */ + Segment_Segment.prototype.getParent = function () { + let parentId = this.getParentId(); + if (parentId) { + return this._shared.segments[parentId] || null; } - return ""; + return null; }; /** @public * @param {Array.=} out_ary @@ -128346,21 +128488,43 @@ Recommended fix: /** @public * @param {string} rid * @param {string=} dataId Row id for retrieving data - * @return {boolean} + * @return {boolean} Returns true only a new child is added */ Segment_Segment.prototype.addChild = function (rid, dataId) { - if (rid) { + if (!rid) { + return false; + } + let prevSegmentId = this._shared.childToSegment[rid]; + if (prevSegmentId) { + if (prevSegmentId !== this._rid) { + let prevSegment = this._shared.segments[prevSegmentId]; + if (prevSegment && !prevSegment.hasSubSegments()) { + // Children of a classified segment always stick the root segment + prevSegment.removeChild(rid); + } + this._shared.childToSegment[rid] = this._rid; + } + } else { this._shared.childToSegment[rid] = this._rid; - if (this._children[rid]) { - this._children[rid] = dataId || rid; // Update data id - } else { - if (this._collapsed) { - this._shared.dirtyCollapsingState = true; // TODO: Check if we need to update this only when new child is added + } + if (dataId != null) { + // Update data id + if (dataId && dataId !== rid) { + if (!this._childDataIds) { + this._childDataIds = {}; } - this._children[rid] = dataId || rid; - ++this._childCount; - return true; + this._childDataIds[rid] = dataId; + } else if (this._childDataIds) { + delete this._childDataIds[rid]; + } + } + let at = this._childIds.indexOf(rid); + if (at < 0) { + if (this._collapsed) { + this._shared.dirtyCollapsingState = true; // TODO: Check if we need to update this only when new child is added } + this._childIds.push(rid); + return true; } return false; }; @@ -128370,8 +128534,14 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.addChildren = function (rids, dataIds) { + if (!rids) { + return false; + } let rowIds = Array.isArray(rids) ? rids : [rids]; let rowCount = rowIds.length; + if (!rowCount) { + return false; + } let dirty = 0; let i; if (dataIds != null) { @@ -128391,26 +128561,35 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.containsChild = function (rid) { - return this._children[rid] ? true : false; + return this._childIds.indexOf(rid) >= 0; + }; + /** @public + * @param {string} rid + * @return {number} + */ + Segment_Segment.prototype.getChildIndex = function (rid) { + return this._childIds.indexOf(rid); }; /** @public * @param {string} rid * @return {boolean} */ Segment_Segment.prototype.removeChild = function (rid) { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + if (!this._childIds.length) { return false; } - if (!this._children[rid]) { + let at = this._childIds.indexOf(rid); + if (at < 0) { return false; // The specified rid is not a child of this segment } - let objMap = this._shared.childToSegment; - delete objMap[rid]; - delete this._children[rid]; // Slow - --this._childCount; + if (this._shared.childToSegment[rid] === this._rid) { + delete this._shared.childToSegment[rid]; + } + this._childIds.splice(at, 1); // Slow + if (this._collapsed) { this._shared.dirtyCollapsingState = true; } @@ -128421,10 +128600,10 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.removeChildren = function (rids) { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + if (!this._childIds.length) { return false; } let rowIds = Array.isArray(rids) ? rids : [rids]; @@ -128439,21 +128618,24 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.removeAllChildren = function () { - if (this._subSegLevel) { + if (this._subSegment) { return false; // Sub segments are not allowed to remove its children } - if (!this._childCount) { + let childCount = this._childIds.length; + if (!this._childIds.length) { return false; } + let segmentId = this._rid; let objMap = this._shared.childToSegment; - let chdr = this._children; - for (let rid in chdr) { - if (objMap[rid]) { - delete objMap[rid]; // TODO: Check if we need to do this + let chdr = this._childIds; + for (let i = 0; i < childCount; ++i) { + let rid = chdr[i]; + if (objMap[rid] === segmentId) { + delete objMap[rid]; } } - this._children = {}; - this._childCount = 0; + this._childIds.length = 0; + this._childDataIds = null; if (this._collapsed) { this._shared.dirtyCollapsingState = true; } @@ -128463,23 +128645,40 @@ Recommended fix: * @return {!Array.} */ Segment_Segment.prototype.getChildIds = function () { - return this._childCount ? Object.keys(this._children) : []; + return this._childIds; // WARNING: Returns private members }; /** @public * @return {!Object} */ Segment_Segment.prototype.getChildren = function () { - return this._children; + let obj = {}; + let chdr = this._childIds; + let childCount = chdr.length; + let dataIds = this._childDataIds || {}; + for (let i = 0; i < childCount; ++i) { + let rid = chdr[i]; + obj[rid] = dataIds[rid] || rid; + } + return obj; }; /** @public * @return {number} */ Segment_Segment.prototype.getChildCount = function () { - return this._childCount; + return this._childIds.length; + }; + /** When a segment is not empty, the visibility of its content need to be updated. + * @public + */ + Segment_Segment.prototype.markCollapsingStateDirty = function () { + // A segment can have a child and/or autogenerated segment (subsegment) to not be considered as empty. + if (this._childIds.length || this._subSegDef) { + this._shared.dirtyCollapsingState = true; + } }; /** @public - * @return {Array.} fields + * @return {Array.} */ Segment_Segment.prototype.getClassification = function () { if (this._subSegDef) { @@ -128492,8 +128691,8 @@ Recommended fix: * @return {boolean} */ Segment_Segment.prototype.setClassification = function (fields) { - if (this._subSegLevel) { - return false; // non-root segment cannot be classified + if (this._subSegment) { + return false; // subsegment cannot be classified } let classifiers = null; if (this._subSegDef) { @@ -128534,9 +128733,8 @@ Recommended fix: } else if (classifiers) { // Remove existing ones this._subSegDef.classifiers = null; - this._subSegDef.subSegments = null; // this._subSegDef.classifierChanged = true; - this._subSegDef = null; // WARNING: All sub segments remain existing + this._subSegDef = null; // WARNING: All subsegments remain existing return true; } return false; @@ -128551,7 +128749,7 @@ Recommended fix: let segmentNames = this._subSegNames; let segmentCount = segmentNames ? segmentNames.length : 0; if (!segmentCount) { - if (this._subSegLevel >= classifierCount) { + if (this._depth >= classifierCount) { return false; // Current segment level is beyond existing classification level and this segment should already be removed } } @@ -128560,7 +128758,7 @@ Recommended fix: sharedObj.dirtyCollapsingState = true; } - // Prepare existing sub segments for checking change in its members + // Prepare existing subsegments for checking change in its members let i; let segmentName = ""; let nonExistenceGroups = {}; @@ -128573,10 +128771,9 @@ Recommended fix: segmentName = segmentNames[i]; nonExistenceGroups[segmentName] = 1; segment = segmentMap[segmentName]; - if (segment._childCount) { + if (segment._childIds.length) { // Quick cleaning up - segment._children = {}; - segment._childCount = 0; + segment._childIds.length = 0; } if (segment._collapsed) { sharedObj.dirtyCollapsingState = true; @@ -128584,18 +128781,21 @@ Recommended fix: } } - // Loop through row children and assign them to their corresponding sub segment - let isRootSegment = !this._subSegLevel; + // Loop through row children and assign them to their corresponding subsegment + let rootSegment = !this._subSegment; + let dataIds = this._childDataIds || {}; let rid; - let children = this._children; - if (this._subSegLevel < classifierCount && rows) { + let chdr = this._childIds; + let childCount = chdr.length; + if (this._depth < classifierCount && rows) { if (!segmentMap) { segmentMap = this._subSegMap = {}; segmentNames = this._subSegNames = []; } - let classifier = classifiers[this._subSegLevel]; - for (rid in children) { - let dataId = children[rid]; + let classifier = classifiers[this._depth]; + for (i = 0; i < childCount; ++i) { + rid = chdr[i]; + let dataId = dataIds[rid] || rid; let record = rows[dataId]; let val = record ? record[classifier] : null; // WARNING: row could already be removed @@ -128613,29 +128813,33 @@ Recommended fix: segment = segmentMap[segmentName]; if (!segment) { // New group is detected - segment = new Segment_Segment(this._rid + "/" + segmentName, sharedObj); + let subSegId = this._rid + "/" + segmentName; + segment = new Segment_Segment(subSegId, sharedObj); segment._subSegDef = this._subSegDef; - segment._subSegLevel = this._subSegLevel + 1; + segment._subSegment = true; // this indicates that the segment is autogenerated (subsegment) + segment._depth = this._depth + 1; segment._subSegName = segmentName; segment._subSegVal = val; - segment._subSegParent = this; + sharedObj.childToSegment[subSegId] = this._rid; // WARNING: this will mix autogenerated rows with actual rows + segmentMap[segmentName] = segment; segmentNames.push(segmentName); this._dispatch("subSegmentAdded", { - "rid": segment.getId(), + "rid": subSegId, "segment": segment }); } segment.addChild(rid, dataId); } - } else if (isRootSegment) { + } else if (rootSegment) { // In case of no classification - for (rid in children) { + for (i = 0; i < childCount; ++i) { + rid = chdr[i]; sharedObj.childToSegment[rid] = this._rid; // Relocate child in case of it has been moved to a non existence group } } - // Remove all sub segments with no members + // Remove all subsegments with no members if (removalCount > 0) { if (removalCount >= segmentNames.length) { segmentNames.length = 0; @@ -128662,7 +128866,7 @@ Recommended fix: } } - // Sort and classify existing sub segments + // Sort and classify existing subsegments segmentCount = segmentNames ? segmentNames.length : 0; if (segmentCount) { segmentNames.sort(Segment_Segment._subSegSortLogic); @@ -128672,23 +128876,17 @@ Recommended fix: } } - // Collecting all sub segments including all descendants and reassigning segment order. - if (isRootSegment) { - // If this is a root segment - if (this._subSegDef) { - if (segmentCount) { - let subSegments = this._subSegDef.subSegments = []; - this.getAllSubSegments(subSegments); - subSegments.forEach(Segment_Segment._assignSubSegmentOrder); - } else { - this._subSegDef.subSegments = null; - } - // this._subSegDef.classifierChanged = false; + // Collecting all subsegments including all descendants and reassigning segment order. + if (rootSegment && this._subSegDef) { + if (segmentCount) { + this.calcSubSegmentOrder(0); } + // this._subSegDef.classifierChanged = false; } return true; }; - /** @public + /** SubSegment implies being classified + * @public * @return {boolean} */ Segment_Segment.prototype.hasSubSegments = function () { @@ -128697,21 +128895,40 @@ Recommended fix: } return false; }; - /** @public + /** SubSegment implies autogenerated segment + * @public * @return {boolean} */ Segment_Segment.prototype.isSubSegment = function () { - return this._subSegLevel ? true : false; + return this._subSegment; + }; + /** @public + * @return {boolean} + */ + Segment_Segment.prototype.isRootSegment = function () { + return this._shared.childToSegment[this._rid] ? false : true; }; /** @public * @return {Segment} */ Segment_Segment.prototype.getFirstAncestor = function () { - if (this._subSegLevel && this._subSegDef) { - let ancestor = this._subSegDef.root; - return /** @type{Segment} */ancestor || null; + let ancestor = null; + if (this._subSegment && this._subSegDef) { + // Quick way to get root + ancestor = this._subSegDef.root; + } else { + // Slow + ancestor = this.getParent(); + if (ancestor) { + let parentSeg = ancestor.getParent(); + while (parentSeg) { + // This could cause infinite loop + ancestor = parentSeg; + parentSeg = ancestor.getParent(); + } + } } - return null; + return ancestor || null; }; /** @public * @param {Array.=} out_ary @@ -128733,13 +128950,74 @@ Recommended fix: } return out_ary || null; }; + /** This method sets order, last order, and depth to entire tree structure in the segment, including the segment itself + * @public + * @param {number} counter + * @return {number} + */ + Segment_Segment.prototype.updateTreeStructure = function (counter) { + if (!counter) { + counter = 0; + if (!this._subSegment) { + // Subsegment's depth cannot be reset back to 0 + this._depth = 0; // WARNING: this assumes counter at 0 is the root segment + } + } + if (this.hasSubSegments()) { + return this.setLastOrder(counter); // Sub segments has already been calculated + } + let segmentSeparators = this._shared.segments; + let childCount = this._childIds.length; + let prevSeg = null; + for (let i = 0; i < childCount; ++i) { + let rid = this._childIds[i]; + let segment = segmentSeparators[rid]; + let segmentId = segment ? segment.getId() : "Uncategorized"; + if (prevSeg !== segmentId) { + ++counter; // 0 become 1 + prevSeg = segmentId; + } + if (segment) { + segment._depth = this._depth + 1; + segment.setOrder(counter); + counter = segment.updateTreeStructure(counter); + } + } + return this.setLastOrder(counter); + }; + /** @public + * @param {number} counter + * @return {number} + */ + Segment_Segment.prototype.calcSubSegmentOrder = function (counter) { + if (!this.hasSubSegments()) { + return this.setLastOrder(counter); + } + let segmentMap = this._subSegMap; + let childCount = this._subSegNames.length; + let prevSeg = null; + for (let i = 0; i < childCount; ++i) { + let segmentName = this._subSegNames[i]; + let segment = segmentMap[segmentName]; + let segmentId = segment ? segment.getId() : "Uncategorized"; + if (prevSeg !== segmentId) { + ++counter; // 0 become 1 + prevSeg = segmentId; + } + if (segment) { + segment.setOrder(counter); + counter = segment.calcSubSegmentOrder(counter); + } + } + return this.setLastOrder(counter); + }; /** @public * @return {number} */ Segment_Segment.prototype.getSegmentLevel = function () { - return this._subSegLevel; + return this._depth; }; - /** This method will be called on sub segments only + /** This method will be called on subsegments only * @public * @param {Object=} rows * @param {Object=} clsSource @@ -128762,7 +129040,7 @@ Recommended fix: let segment = this; while (segment && segment.isSubSegment()) { segment.getSubSegmentName(row); - segment = segment._subSegParent; + segment = segment.getParent(); } }; /** @public @@ -128770,9 +129048,9 @@ Recommended fix: * @return {string} */ Segment_Segment.prototype.getSubSegmentName = function (row) { - if (row && this._subSegLevel) { + if (row && this._subSegment) { let classifiers = this.getClassification(); - let field = classifiers[this._subSegLevel - 1]; + let field = classifiers[this._depth - 1]; if (field) { row[field] = this._subSegName; } @@ -128788,9 +129066,7 @@ Recommended fix: bool = bool !== false; if (this._collapsed !== bool) { this._collapsed = bool; - if (this._childCount || this._subSegDef) { - this._shared.dirtyCollapsingState = true; - } + this.markCollapsingStateDirty(); return true; } return false; @@ -128808,84 +129084,86 @@ Recommended fix: Segment_Segment.prototype.isCollapsed = function () { return this._collapsed; }; - /** @public + /** Get all collapsing state from all children (subsegments and child segments), excluding the segment itself + * @public * @param {Object=} objMap * @param {boolean=} parentState=false Collapsing state from parent segment * @return {boolean} */ Segment_Segment.prototype.getCollapsingStates = function (objMap, parentState) { - let segmentNames = this._subSegNames; - if (!this._subSegLevel) { - // Only root segment - if (!segmentNames) { - // No sub segment - if (!this._collapsed) { - return false; - } - } + let childList = this._subSegNames; + let segmentMap = this._subSegMap; + let subSegment = true; // Normal segments can have subsegments without being subsegment themselve + if (!childList && this._shared) { + // Ensure that segment has not been disposed + childList = this._childIds; + segmentMap = this._shared.segments; + subSegment = false; + } + let childCount = childList ? childList.length : 0; + if (!childCount) { + return false; } + let dirty = false; + let childCollapsed = parentState || this._collapsed ? true : false; if (!objMap) { objMap = {}; } - let dirty = false; - if (this._subSegLevel) { - // Sub segments are also subjected to collapsing - if (parentState) { - objMap[this._rid] = true; + for (let i = 0; i < childCount; ++i) { + let rid = ""; + let segment = null; + if (subSegment) { + segment = segmentMap[childList[i]]; // Use segment name to retrieve subsegment + rid = segment.getId(); + } else { + rid = childList[i]; + segment = segmentMap[rid]; // Use row id to retrieve segment from shared map + } + if (childCollapsed) { + objMap[rid] = childCollapsed; // Collapsing states for all children is registered here dirty = true; } - } - if (this._childCount) { - let collapsed = parentState || this._collapsed; - if (segmentNames) { - let segmentMap = this._subSegMap; - let segmentCount = segmentNames.length; - for (let i = 0; i < segmentCount; ++i) { - let segment = segmentMap[segmentNames[i]]; - objMap[segment.getId()] = !!parentState; - if (segment.getCollapsingStates(objMap, collapsed)) { - dirty = true; - } - } - } else if (collapsed) { - let chdr = this._children; - for (let rid in chdr) { - objMap[rid] = collapsed; - } + if (segment && segment.getCollapsingStates(objMap, childCollapsed)) { dirty = true; } } return dirty; }; + /** @private + * @return {number} + */ + Segment_Segment.prototype._getOrder = function () { + return this._order * 10000; + }; + /** @private + * @return {number} + */ + Segment_Segment.prototype._getLastOrder = function () { + return this._getOrder() + this._offsetOrder; + }; /** @public * @return {number} */ Segment_Segment.prototype.getOrder = function () { - if (this._subSegLevel) { - let ancestor = this.getFirstAncestor(); - if (ancestor) { - // WARNING: this._order cannot be greater than 9999 - return ancestor.getOrder() + this._order; - } + let ancestor = this.getFirstAncestor(); + if (ancestor) { + // WARNING: this._order cannot be greater than 9999 + return ancestor._getOrder() + this._order; } - return this._order * 10000; + return this._getOrder(); }; /** Get the last (highest) order from the entire tree regardless of the current position segment in the hierachy * @public * @return {number} */ Segment_Segment.prototype.getLastOrder = function () { - if (this._subSegDef) { - let subSegments = this._subSegDef.subSegments; - if (subSegments) { - let lastSegment = subSegments[subSegments.length - 1]; - if (lastSegment) { - return lastSegment.getOrder(); - } - } + let ancestor = this.getFirstAncestor(); + if (ancestor) { + // WARNING: this._order cannot be greater than 9999 + return ancestor._getLastOrder(); } - return this.getOrder(); + return this._getLastOrder(); }; /** @public * @param {number} val @@ -128893,6 +129171,13 @@ Recommended fix: Segment_Segment.prototype.setOrder = function (val) { this._order = val; }; + /** @public + * @param {number} val + * @returns {number} Returns the number set + */ + Segment_Segment.prototype.setLastOrder = function (val) { + return this._offsetOrder = val; + }; /** @private * @type {Array.} @@ -128900,9 +129185,10 @@ Recommended fix: Segment_Segment._tabs = null; /** @public * @param {Array.=} lines + * @param {number=} tabLevel * @return {!Array.} lines */ - Segment_Segment.prototype.log = function (lines) { + Segment_Segment.prototype.log = function (lines, tabLevel) { if (!lines) { lines = []; } @@ -128916,19 +129202,37 @@ Recommended fix: tabCh += " "; } } + if (!tabLevel) { + tabLevel = 0; + } let collapsedCh = this._collapsed ? "+ " : "- "; - lines.push(tabs[this._subSegLevel] + collapsedCh + this._rid); - let segmentNames = this._subSegNames; - if (segmentNames) { - let segmentCount = segmentNames.length; - let segmentMap = this._subSegMap; - for (i = 0; i < segmentCount; ++i) { - segmentMap[segmentNames[i]].log(lines); + lines.push(tabs[tabLevel] + collapsedCh + this._rid); + let childLevel = tabLevel + 1; + let childIndent = tabs[childLevel]; + let childList = this._subSegNames; + let segmentMap = this._subSegMap; + let subSegment = true; // Normal segments can have subsegments without being subsegment themselve + if (!childList && this._shared) { + // Ensure that segment has not been disposed + childList = this._childIds; + segmentMap = this._shared.segments; + subSegment = false; + } + let childCount = childList ? childList.length : 0; + for (i = 0; i < childCount; ++i) { + let rid = ""; + let segment = null; + if (subSegment) { + segment = segmentMap[childList[i]]; // Use segment name to retrieve subsegment + rid = segment.getId(); + } else { + rid = childList[i]; + segment = segmentMap[rid]; // Use row id to retrieve segment from shared map } - } else if (this._childCount) { - let indent = tabs[this._subSegLevel + 1]; - for (let rid in this._children) { - lines.push(indent + "- " + rid); + if (segment) { + segment.log(lines, childLevel); + } else { + lines.push(childIndent + "- " + rid); } } return lines; @@ -128948,6 +129252,7 @@ Recommended fix: this._insertionList = []; this._removalList = []; this._shared = { + segments: this._segments, childToSegment: {}, // child Id to segment Id dirtyCollapsingState: false, @@ -129008,10 +129313,6 @@ Recommended fix: */ SegmentCollection.prototype.addSegment = function (rid, childRids) { if (rid && !this._segments[rid]) { - if (this.getParentRowId(rid)) { - console.log("child of a segment cannot be set as a segment separator"); - return false; - } let segment = this._segments[rid] = new data_Segment(rid, this._shared); segment.addEventListener("subSegmentAdded", this._onSubSegmentAdded); segment.addEventListener("subSegmentRemoved", this._onSubSegmentRemoved); @@ -129058,32 +129359,40 @@ Recommended fix: */ SegmentCollection.prototype.removeSegment = function (rid) { let segment = this._segments[rid]; - if (segment) { - if (this._segmentCount <= 1) { - return this.removeAllSegments(); - } - if (segment.isSubSegment()) { - this._removalList.push(segment.getId()); - } - let subSegIds = segment.getSubSegmentIds(); - if (subSegIds) { - let len = subSegIds.length; - for (let i = 0; i < len; ++i) { - let subSegId = subSegIds[i]; - if (this._segments[subSegId]) { - this._removalList.push(subSegId); - delete this._segments[subSegId]; // Slow - --this._segmentCount; - } + if (!segment) { + return false; + } + if (this._segmentCount <= 1) { + return this.removeAllSegments(); + } + let subSegment = segment.isSubSegment(); + if (subSegment) { + this._removalList.push(segment.getId()); + } + let subSegIds = segment.getSubSegmentIds(); + if (subSegIds) { + let len = subSegIds.length; + for (let i = 0; i < len; ++i) { + let subSegId = subSegIds[i]; + if (this._segments[subSegId]) { + this._removalList.push(subSegId); + delete this._segments[subSegId]; // Slow + --this._segmentCount; } } - segment.removeAllChildren(); // This is important for updating childToSegment - segment.dispose(); - delete this._segments[rid]; // Slow - --this._segmentCount; - return true; } - return false; + if (!subSegment) { + let parentSeg = segment.getParent(); + if (parentSeg) { + // Move existing children to its parent + parentSeg.addChildren(segment.getChildIds()); // WARNING: passing private member + } + } + segment.removeAllChildren(); // This is important for updating childToSegment + segment.dispose(); + delete this._segments[rid]; // Slow + --this._segmentCount; + return true; }; /** @public * @return {boolean} Returns true if there is any change. Otherwise, returns false @@ -129096,6 +129405,7 @@ Recommended fix: this._segments = {}; this._segmentCount = 0; this._segmentList = null; + this._shared.segments = this._segments; this._shared.childToSegment = {}; this._classification = this._classifierChanged = false; return true; @@ -129219,7 +129529,7 @@ Recommended fix: collapsedRids = {}; for (let rid in segmentSeparators) { let segment = segmentSeparators[rid]; - if (!segment.isSubSegment()) { + if (segment.isRootSegment()) { if (segment.getCollapsingStates(collapsedRids)) { ++count; } @@ -129231,6 +129541,31 @@ Recommended fix: return this._collapsedRids; }; + /** Invalidate segment order cache, if the given row id is a segment separator + * @private + * @param {string|Array.} segmentIds + * @returns {boolean} Returns true if there is any change + */ + SegmentCollection.prototype._invalidateSegmentOrder = function (segmentIds) { + if (this._segmentList) { + if (typeof segmentIds === "string") { + if (this._segments[segmentIds]) { + this._segmentList = null; + return true; + } + } else if (Array.isArray(segmentIds)) { + let len = segmentIds.length; + for (let i = 0; i < len; ++i) { + let segmentId = segmentIds[i]; + if (this._segments[segmentId]) { + this._segmentList = null; + return true; + } + } + } + } + return false; + }; /** @public * @param {string} segmentId * @param {string} rid @@ -129240,6 +129575,8 @@ Recommended fix: SegmentCollection.prototype.addSegmentChild = function (segmentId, rid, dataId) { let segment = this._segments[segmentId]; if (segment && !segment.isSubSegment()) { + // If a segment becomes a child of other segment, then the segment order needs to be recalculated + this._invalidateSegmentOrder(rid); return segment.addChild(rid, dataId); } return false; @@ -129253,11 +129590,14 @@ Recommended fix: SegmentCollection.prototype.addSegmentChildren = function (segmentId, rids, dataIds) { let segment = this._segments[segmentId]; if (segment && !segment.isSubSegment()) { + // If a segment becomes a child of other segment, then the segment order needs to be recalculated + this._invalidateSegmentOrder(rids); return segment.addChildren(rids, dataIds); } return false; }; - /** @public + /** This only works for immediate children of the specified segment + * @public * @param {string} segmentId * @param {string} rid * @return {boolean} Returns true if there is any change. Otherwise, returns false @@ -129277,6 +129617,7 @@ Recommended fix: SegmentCollection.prototype.removeSegmentChild = function (segmentId, rid) { let segment = this._segments[segmentId]; if (segment) { + this._invalidateSegmentOrder(rid); return segment.removeChild(rid); } return false; @@ -129289,6 +129630,7 @@ Recommended fix: SegmentCollection.prototype.removeSegmentChildren = function (segmentId, rids) { let segment = this._segments[segmentId]; if (segment) { + this._invalidateSegmentOrder(rids); return segment.removeChildren(rids); } return false; @@ -129307,6 +129649,7 @@ Recommended fix: } } if (dirty) { + this._segmentList = null; // WARNING: not optimized this.classify(null); } return dirty; @@ -129363,10 +129706,14 @@ Recommended fix: }; /** @public * @param {Array.} rids + * @param {boolean=} useCache=false If this is true, skip the calculation when there is already a cache for segment order */ - SegmentCollection.prototype.calcSegmentOrder = function (rids) { + SegmentCollection.prototype.calcSegmentOrder = function (rids, useCache) { let segmentList = this._segmentList; if (segmentList) { + if (useCache) { + return; // Use previous cache for segment order + } segmentList.length = 0; } else { segmentList = this._segmentList = []; @@ -129379,9 +129726,10 @@ Recommended fix: let rid = rids[i]; let segment = segmentSeparators[rid]; if (segment) { - if (!segment.isSubSegment()) { + if (segment.isRootSegment()) { this._segmentList.push(segment); segment.setOrder(++order); // WARNING: Segments and sub segments start with 1 + segment.updateTreeStructure(0); } if (--segmentCount <= 0) { break; @@ -129405,7 +129753,7 @@ Recommended fix: let prevSegment = null; let segmentValues = new Array(rowCount); let segmentVal = 0; - let highestVal = -10; + let highestVal = 0; let offset = 0; for (let r = 0; r < rowCount; ++r) { let rid = rids[r]; @@ -129414,7 +129762,7 @@ Recommended fix: // segment separator segmentVal = curSegment.getOrder() * 100; offset = 0; - if (!curSegment.isSubSegment()) { + if (curSegment.isRootSegment()) { if (prevSegment !== curSegment) { prevSegment = curSegment; highestVal = curSegment.getLastOrder() * 100; @@ -129428,12 +129776,15 @@ Recommended fix: segmentVal = curSegment.getOrder() * 100; offset = 1; if (partial) { + // This fixes the out of order sub segment highestVal = curSegment.getLastOrder() * 100; } } else { // row outside of segments if (highestVal) { - segmentVal = highestVal; + if (segmentVal < highestVal) { + segmentVal = highestVal; + } offset = 10; } else { segmentVal = offset = 0; @@ -129455,7 +129806,10 @@ Recommended fix: let segmentCount = segmentList.length; let lines = []; for (let i = 0; i < segmentCount; ++i) { - segmentList[i].log(lines); + let segment = segmentList[i]; + if (segment.isRootSegment()) { + segment.log(lines); + } } return lines.join("\n"); }; @@ -129464,10 +129818,14 @@ Recommended fix: */ SegmentCollection.prototype.logRowIdMap = function () { let lines = []; + let segmentSeparators = this._segments; let childToSegmentId = this._shared.childToSegment; for (let rid in childToSegmentId) { let segmentId = childToSegmentId[rid]; - lines.push(rid + " > " + segmentId); + let segment = segmentSeparators[segmentId]; + if (!segment || !segment.isSubSegment()) { + lines.push(rid + " > " + segmentId); + } } return lines.join("\n"); }; @@ -130566,63 +130924,65 @@ Recommended fix: this._segments.addEventListener("subSegmentChanged", this._onSubSegmentChanged); } }; - /** + /** Add or remove all segments from the given row ids * @public * @param {Array.} rids * @param {boolean=} enabled * @return {boolean} Return true if there is any change */ DataTable.prototype.setSegmentSeparators = function (rids, enabled) { - let change = false; - if (rids) { - let len = rids.length; - let segmentChanged = false; - for (let i = 0; i < len; i++) { - if (enabled !== false) { - let rid = rids[i]; - this._initSegmentCollection(); - if (this._autoSegmentFilling) { - let parentId = this._segments.getParentRowId(rid); - if (parentId) { - this._segments.removeSegmentChild(parentId, rid); - } + if (!rids) { + return false; + } + let adding = enabled !== false; + let segmentAdded = 0; + let segmentRemoved = 0; + let len = rids.length; + for (let i = 0; i < len; i++) { + let rid = rids[i]; + if (adding) { + this._initSegmentCollection(); + if (this._autoSegmentFilling) { + let parentId = this._segments.getParentRowId(rid); + if (parentId) { + this._segments.removeSegmentChild(parentId, rid); } - segmentChanged = this._segments.addSegment(rid); - } else if (this._segments) { - // remove case - let segment = this._segments.getSegment(rid); - if (segment) { - if (this._segments.removeSegment(rid)) { - change = true; - if (!this._segments.getSegmentCount()) { - this._segments = null; - } + } + segmentAdded |= this._segments.addSegment(rid); + } else if (this._segments) { + // Removing + let segment = this._segments.getSegment(rid); + if (segment) { + if (this._segments.removeSegment(rid)) { + segmentRemoved = 1; + if (!this._segments.getSegmentCount()) { + this._segments = null; } } } } - if (enabled !== false && segmentChanged) { - this._segments.calcSegmentOrder(this._rids); - change = true; - } - if (change) { - this.dispatchGlobalChange(); - } } - return change; + if (segmentAdded) { + this._segments.calcSegmentOrder(this._rids); + } + let changed = segmentAdded || segmentRemoved; + if (changed && this._needFiring()) { + this.dispatchGlobalChange(); + } + return changed ? true : false; }; /** * @public * @param {string} rid - * @param {boolean=} enabled + * @param {*=} options=null Segment options. If the value is false, segment separator will be stripped off from the given rid * @return {boolean} Return true if there is any change */ - DataTable.prototype.setSegmentSeparator = function (rid, enabled) { + DataTable.prototype.setSegmentSeparator = function (rid, options) { let change = false; let memberCount = 0; if (rid && typeof rid === "string") { - if (enabled !== false) { + if (options !== false) { this._initSegmentCollection(); if (this._autoSegmentFilling) { let parentId = this._segments.getParentRowId(rid); @@ -130630,12 +130990,13 @@ Recommended fix: this._segments.removeSegmentChild(parentId, rid); } } - if (this._segments.addSegment(rid)) { + let children = options && options["children"] ? options["children"] : null; + if (this._segments.addSegment(rid, children)) { this._segments.calcSegmentOrder(this._rids); change = true; } } else if (this._segments) { - // mean remove separator + // Remove the separator let segment = this._segments.getSegment(rid); if (segment) { memberCount = segment.getChildCount(); @@ -130829,6 +131190,20 @@ Recommended fix: } return false; }; + /** @private + * @param {boolean=} adding This indicates that segment is changed by adding a new child + */ + DataTable.prototype._onSegmentChildChanged = function (adding) { + if (this._segments) { + this._segments.calcSegmentOrder(this._rids, true); + } + if (adding !== false) { + this._sort(null); + } + this._dispatchPositionChange(); // Force rerendering, even if there is no position change + + this.requestClassifying(); + }; /** @public * @param {string} segmentId Row id * @param {string} rid Row id @@ -130839,10 +131214,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.addSegmentChild(segmentId, rid, dataId); if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } } @@ -130858,17 +131230,15 @@ Recommended fix: if (this._segments) { let dirty = this._segments.addSegmentChildren(segmentId, rids, dataIds); if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } } return false; }; - /** @public + /** Deprecated. Remove all existing children and add new children according to the give array + * @public * @param {Array.} segmentArr Segment array that contain "segmentId", "rowIds" to set segment children * @return {boolean} Return true if there is any change */ @@ -130876,20 +131246,16 @@ Recommended fix: if (!this._segments) { return false; } - this.removeAllSegmentChildren(); + let dirty = this._segments.removeAllSegmentChildren(); let len = segmentArr.length; - let dirty; for (let i = 0; i < len; i++) { let obj = segmentArr[i]; - if (this._segments.addSegmentChildren(obj.segmentId, obj.rowIds)) { + if (this._segments.addSegmentChildren(obj["segmentId"], obj["rowIds"])) { dirty = true; } } if (dirty) { - this._sort(null); - this._dispatchPositionChange(); // Force rerendering, even if there is no position change - - this.requestClassifying(); + this._onSegmentChildChanged(); return true; } return false; @@ -130903,8 +131269,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeSegmentChild(segmentId, rid); if (dirty) { - this.dispatchGlobalChange(); - this.requestClassifying(); + this._onSegmentChildChanged(false); } return dirty; } @@ -130919,8 +131284,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeSegmentChildren(segmentId, rids); if (dirty) { - this.dispatchGlobalChange(); - this.requestClassifying(); + this._onSegmentChildChanged(false); } return dirty; } @@ -130933,7 +131297,7 @@ Recommended fix: if (this._segments) { let dirty = this._segments.removeAllSegmentChildren(); // This immediately remove all sub segments if (dirty) { - this.dispatchGlobalChange(); + this._onSegmentChildChanged(false); } return dirty; } @@ -152380,13 +152744,13 @@ Recommended fix: } return false; }; - /** Set visible row as segment separator (hidden or filtered rows cannot be a segment separator) + /** Set visible row as a segment separator (hidden or filtered rows cannot be a segment separator) * @public * @param {string|number} rowRef Row id or row index - * @param {boolean=} enabled + * @param {*=} options=null Segment options. If the value is false, segment separator will be stripped off from the given rid * @return {boolean} Return true if there is any change */ - DataView_DataView.prototype.setSegmentSeparator = function (rowRef, enabled) { + DataView_DataView.prototype.setSegmentSeparator = function (rowRef, options) { let rowId = ""; if (typeof rowRef === "number") { rowId = this.getRowId(rowRef); @@ -152394,12 +152758,12 @@ Recommended fix: rowId = rowRef; // WARNING: Invisible row id can still be set as segment separator as long as it is in the data table } if (rowId) { - enabled = enabled !== false; - if (enabled) { + if (options !== false) { + // undefined, null, object, or true value this.synchronizeRowOrder(); } // TODO: Force expanding of segment before unsetting segment separator - return this._dt.setSegmentSeparator(rowId, enabled); + return this._dt.setSegmentSeparator(rowId, options); } return false; }; @@ -157151,7 +157515,7 @@ Recommended fix: * @return {string} */ Core.getVersion = function () { - return "5.1.137"; + return "5.1.139"; }; /** {@link ElementWrapper#dispose} * @override @@ -171896,7 +172260,7 @@ Recommended fix: ; // CONCATENATED MODULE: ./public/lib/grid/index.js window.EFX_GRID = { - version: "6.0.146" + version: "6.0.149" }; ; // CONCATENATED MODULE: ./public/lib/grid/themes/halo/light/efx-grid.js @@ -179801,7 +180165,7 @@ Recommended fix: dispatchEvent(new CustomEvent('ef.nativeStyles.define', { detail: { name: 'html', - styles: 'html{height:100%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;--color-scheme-primary:#334BFF;--color-scheme-secondary:#6678FF;--color-scheme-tertiary:#FAFAFA;--color-scheme-complementary:#0D0D0D;--color-scheme-negative:#B63243;--color-scheme-neutral:#404040;--color-scheme-positive:#246B3E;--color-scheme-tickup:#246B3E;--color-scheme-tickdown:#B63243;--color-scheme-ticktext:#FFFFFF;--theme-name:\'halo-theme\';--theme-version:\'6.8.0\'}html[movement-color-profile=asian1]{--color-scheme-negative:#246B3E;--color-scheme-neutral:#404040;--color-scheme-positive:#B63243;--color-scheme-tickup:#B63243;--color-scheme-tickdown:#246B3E}html[movement-color-profile=asian2],html[movement-color-profile=european]{--color-scheme-negative:#B63243;--color-scheme-neutral:#246B3E;--color-scheme-positive:#334BFF;--color-scheme-tickup:#246B3E;--color-scheme-tickdown:#B63243}::-moz-selection{color:#fff;background:#334bff}::selection{color:#fff;background:#334bff}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}@supports not selector(::-webkit-scrollbar){html{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin;scrollbar-width:auto}}' + styles: 'html{height:100%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;scrollbar-face-color:#999;scrollbar-shadow-color:#999;scrollbar-highlight-color:#999;scrollbar-arrow-color:#999;scrollbar-track-color:#f2f2f2;scrollbar-3dlight-color:#f2f2f2;scrollbar-darkshadow-color:#f2f2f2;--color-scheme-primary:#334BFF;--color-scheme-secondary:#6678FF;--color-scheme-tertiary:#FAFAFA;--color-scheme-complementary:#0D0D0D;--color-scheme-negative:#B63243;--color-scheme-neutral:#404040;--color-scheme-positive:#246B3E;--color-scheme-tickup:#246B3E;--color-scheme-tickdown:#B63243;--color-scheme-ticktext:#FFFFFF;--theme-name:\'halo-theme\';--theme-version:\'6.8.1\'}html[movement-color-profile=asian1]{--color-scheme-negative:#246B3E;--color-scheme-neutral:#404040;--color-scheme-positive:#B63243;--color-scheme-tickup:#B63243;--color-scheme-tickdown:#246B3E}html[movement-color-profile=asian2],html[movement-color-profile=european]{--color-scheme-negative:#B63243;--color-scheme-neutral:#246B3E;--color-scheme-positive:#334BFF;--color-scheme-tickup:#246B3E;--color-scheme-tickdown:#B63243}::-moz-selection{color:#fff;background:#334bff}::selection{color:#fff;background:#334bff}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}@supports not selector(::-webkit-scrollbar){html{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin;scrollbar-width:auto}}' } })); ; // CONCATENATED MODULE: ./node_modules/@refinitiv-ui/halo-theme/light/input.js diff --git a/template-146.html b/template-146.html index 7400550f..5a5971d4 100644 --- a/template-146.html +++ b/template-146.html @@ -3,25 +3,28 @@

Support

Creating a live example

Grid's dependencies are available for Code Sandbox(Devbox), making it simple to create your own live demonstration. The live example imitated issues are very significant because it helps us in our investigation and save us time. To create a live example page you can follow the below instructions:

    -
  • Sign up for a Code Sandbox(Devbox) account or log in if you already have one.
    • +
  • Sign up for a Code Sandbox (Devbox) account or log in if you already have one.
  • Open one of the following template.
    • -
  • Fork the template by clicking the fork button in the top right of the screen.
    • -
  • Modify the code in live example as desired and save it by pressing Ctrl/Cmd + S.
    • -
  • Share the link using the instructions below:
      -
    • Click "Share" at the top right of the screen.
      • -
    • Click "Copy" in the Share URL section. The link will now be copied to your clipboard.
      • +
    • Fork the template by clicking the "Fork" button at the top right of the screen.
      • +
    • Modify the code in your live example as desired and save it by pressing Ctrl/Cmd + S.
      • +
    • Share the link by following below steps:
        +
      • Click "Share" button at the top right of the screen.
        • +
      • Select "Unlisted" option from the dropdown box on "Visbility" section.
        • +
      • Click "Move Devbox" button to change the draft to permanent one and get the link.
        • +
      • Uncheck "Include editor layout" to shorthen the link.
        • +
      • Click "Copy" button to copy the link. The link will be available in your system's clipboard.
      -
      • +
    -