@websy/websy-designs 1.2.23 → 1.2.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/websy-designs-es6.debug.js +31 -20
- package/dist/websy-designs-es6.js +26 -12
- package/dist/websy-designs-es6.min.js +1 -1
- package/dist/websy-designs.debug.js +30 -20
- package/dist/websy-designs.js +20 -12
- package/dist/websy-designs.min.css +1 -1
- package/dist/websy-designs.min.js +1 -1
- package/package.json +1 -1
|
@@ -27,6 +27,7 @@
|
|
|
27
27
|
ResponsiveText
|
|
28
28
|
*/
|
|
29
29
|
import WebsyDesignsQlikPlugins from '@websy/websy-designs-qlik-plugin/dist/websy-designs-qlik-plugin-es6'
|
|
30
|
+
import * as d3 from 'd3'
|
|
30
31
|
/* global XMLHttpRequest fetch ENV */
|
|
31
32
|
class APIService {
|
|
32
33
|
constructor (baseUrl = '', options = {}) {
|
|
@@ -213,6 +214,9 @@ class WebsyDatePicker {
|
|
|
213
214
|
dateFormat: '%_m/%_d/%Y',
|
|
214
215
|
allowClear: true,
|
|
215
216
|
hideRanges: false,
|
|
217
|
+
arrowIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z"/></svg>`,
|
|
218
|
+
clearIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512"><line x1="368" y1="368" x2="144" y2="144" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="368" y1="144" x2="144" y2="368" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>`,
|
|
219
|
+
confirmIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 512 512"><polyline points="416 128 192 384 96 288" style="fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>`,
|
|
216
220
|
minAllowedDate: this.floorDate(new Date(new Date((new Date().setFullYear(new Date().getFullYear() - 1))).setDate(1))),
|
|
217
221
|
maxAllowedDate: this.floorDate(new Date((new Date()))),
|
|
218
222
|
minAllowedYear: 1970,
|
|
@@ -288,7 +292,7 @@ class WebsyDatePicker {
|
|
|
288
292
|
],
|
|
289
293
|
monthyear: [
|
|
290
294
|
{
|
|
291
|
-
label: 'All',
|
|
295
|
+
label: 'All Month Years',
|
|
292
296
|
range: [DEFAULTS.minAllowedDate, DEFAULTS.maxAllowedDate]
|
|
293
297
|
},
|
|
294
298
|
{
|
|
@@ -306,7 +310,7 @@ class WebsyDatePicker {
|
|
|
306
310
|
],
|
|
307
311
|
hour: [
|
|
308
312
|
{
|
|
309
|
-
label: 'All',
|
|
313
|
+
label: 'All Hours',
|
|
310
314
|
range: ['00:00', '23:00']
|
|
311
315
|
}
|
|
312
316
|
]
|
|
@@ -335,12 +339,10 @@ class WebsyDatePicker {
|
|
|
335
339
|
<span class='websy-dropdown-header-label'>${this.options.label || 'Date'}</span>
|
|
336
340
|
<div id="${this.elementId}_header" class='websy-date-picker-header ${this.options.allowClear === true ? 'allow-clear' : ''}'>
|
|
337
341
|
<span id='${this.elementId}_selectedRange'>${this.options.ranges[this.options.mode][this.selectedRange].label}</span>
|
|
338
|
-
|
|
342
|
+
${this.options.arrowIcon}
|
|
339
343
|
`
|
|
340
344
|
if (this.options.allowClear === true) {
|
|
341
|
-
html +=
|
|
342
|
-
<svg class='clear-selection' xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512"><title>ionicons-v5-l</title><line x1="368" y1="368" x2="144" y2="144" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="368" y1="144" x2="144" y2="368" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
|
|
343
|
-
`
|
|
345
|
+
html += `<div class='clear-selection'>${this.options.clearIcon}</div>`
|
|
344
346
|
}
|
|
345
347
|
html += `
|
|
346
348
|
</div>
|
|
@@ -355,10 +357,10 @@ class WebsyDatePicker {
|
|
|
355
357
|
<div class='websy-dp-button-container'>
|
|
356
358
|
<span class="dp-footnote">Click and drag or hold Shift and click to select a range of values</span>
|
|
357
359
|
<button class='${this.options.cancelBtnClasses || ''} websy-btn websy-dp-cancel'>
|
|
358
|
-
|
|
360
|
+
${this.options.clearIcon}
|
|
359
361
|
</button>
|
|
360
362
|
<button class='${this.options.confirmBtnClasses || ''} websy-btn websy-dp-confirm'>
|
|
361
|
-
|
|
363
|
+
${this.options.confirmIcon}
|
|
362
364
|
</button>
|
|
363
365
|
</div>
|
|
364
366
|
</div>
|
|
@@ -1100,7 +1102,11 @@ class WebsyDropdown {
|
|
|
1100
1102
|
minSearchCharacters: 2,
|
|
1101
1103
|
showCompleteSelectedList: false,
|
|
1102
1104
|
closeAfterSelection: true,
|
|
1103
|
-
customActions: []
|
|
1105
|
+
customActions: [],
|
|
1106
|
+
searchIcon: `<svg class='search' width="20" height="20" viewBox="0 0 512 512"><path d="M221.09,64A157.09,157.09,0,1,0,378.18,221.09,157.1,157.1,0,0,0,221.09,64Z" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/><line x1="338.29" y1="338.29" x2="448" y2="448" style="fill:none;stroke:#000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"/></svg>`,
|
|
1107
|
+
clearIcon: `<svg class='clear' xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512"><title>ionicons-v5-l</title><line x1="368" y1="368" x2="144" y2="144" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="368" y1="144" x2="144" y2="368" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>`,
|
|
1108
|
+
arrowIcon: `<svg class='arrow' xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z"/></svg>`,
|
|
1109
|
+
actionsIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 512 512">><circle cx="256" cy="256" r="32" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/><circle cx="416" cy="256" r="32" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/><circle cx="96" cy="256" r="32" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/></svg>`
|
|
1104
1110
|
}
|
|
1105
1111
|
this.options = Object.assign({}, DEFAULTS, options)
|
|
1106
1112
|
if (this.options.items.length > 0) {
|
|
@@ -1128,16 +1134,16 @@ class WebsyDropdown {
|
|
|
1128
1134
|
let html = `
|
|
1129
1135
|
<div id='${this.elementId}_container' class='websy-dropdown-container ${this.options.disabled ? 'disabled' : ''} ${this.options.disableSearch !== true ? 'with-search' : ''} ${this.options.style} ${this.options.customActions.length > 0 ? 'with-actions' : ''}'>
|
|
1130
1136
|
<div id='${this.elementId}_header' class='websy-dropdown-header ${this.selectedItems.length === 1 ? 'one-selected' : ''} ${this.options.allowClear === true ? 'allow-clear' : ''}'>
|
|
1131
|
-
|
|
1132
|
-
<span
|
|
1133
|
-
|
|
1137
|
+
${this.options.searchIcon}
|
|
1138
|
+
<span>
|
|
1139
|
+
<span class='websy-dropdown-header-value' data-info='${headerLabel}' id='${this.elementId}_selectedItems'>${headerLabel}</span>
|
|
1140
|
+
<span class='websy-dropdown-header-label' id='${this.elementId}_headerLabel'>${this.options.label}</span>
|
|
1141
|
+
</span>
|
|
1134
1142
|
<input class='dropdown-input' id='${this.elementId}_input' name='${this.options.field || this.options.label}' value='${headerValue}'>
|
|
1135
|
-
|
|
1143
|
+
${this.options.arrowIcon}
|
|
1136
1144
|
`
|
|
1137
1145
|
if (this.options.allowClear === true) {
|
|
1138
|
-
html +=
|
|
1139
|
-
<svg class='clear' xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512"><title>ionicons-v5-l</title><line x1="368" y1="368" x2="144" y2="144" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="368" y1="144" x2="144" y2="368" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>
|
|
1140
|
-
`
|
|
1146
|
+
html += this.options.clearIcon
|
|
1141
1147
|
}
|
|
1142
1148
|
html += `
|
|
1143
1149
|
</div>
|
|
@@ -1147,8 +1153,9 @@ class WebsyDropdown {
|
|
|
1147
1153
|
if (this.options.customActions.length > 0) {
|
|
1148
1154
|
html += `
|
|
1149
1155
|
<div class='websy-dropdown-action-container'>
|
|
1156
|
+
${this.options.actionsTitle || ''}
|
|
1150
1157
|
<button class='websy-dropdown-action-button'>
|
|
1151
|
-
|
|
1158
|
+
${this.options.actionsIcon}
|
|
1152
1159
|
</button>
|
|
1153
1160
|
<ul id='${this.elementId}_actionContainer'>
|
|
1154
1161
|
`
|
|
@@ -1164,7 +1171,9 @@ class WebsyDropdown {
|
|
|
1164
1171
|
}
|
|
1165
1172
|
if (this.options.disableSearch !== true) {
|
|
1166
1173
|
html += `
|
|
1167
|
-
<
|
|
1174
|
+
<div class='websy-dropdown-search-container'>
|
|
1175
|
+
<input id='${this.elementId}_search' class='websy-dropdown-search' placeholder='${this.options.searchPlaceholder || 'Search'}'>
|
|
1176
|
+
</div>
|
|
1168
1177
|
`
|
|
1169
1178
|
}
|
|
1170
1179
|
html += `
|
|
@@ -4411,9 +4420,10 @@ class WebsyTable2 {
|
|
|
4411
4420
|
}
|
|
4412
4421
|
if (event.target.classList.contains('sortable-column')) {
|
|
4413
4422
|
const colIndex = +event.target.getAttribute('data-index')
|
|
4423
|
+
const sortIndex = +event.target.getAttribute('data-sort-index')
|
|
4414
4424
|
const column = this.options.columns[colIndex]
|
|
4415
4425
|
if (this.options.onSort) {
|
|
4416
|
-
this.options.onSort(event, column, colIndex)
|
|
4426
|
+
this.options.onSort(event, column, colIndex, sortIndex)
|
|
4417
4427
|
}
|
|
4418
4428
|
else {
|
|
4419
4429
|
this.internalSort(column, colIndex)
|
|
@@ -4625,7 +4635,8 @@ class WebsyTable2 {
|
|
|
4625
4635
|
<div class="leftSection">
|
|
4626
4636
|
<div
|
|
4627
4637
|
class="tableHeaderField ${['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : ''}"
|
|
4628
|
-
data-index="${i}"
|
|
4638
|
+
data-sort-index="${c.sortIndex || i}"
|
|
4639
|
+
data-index="${i}"
|
|
4629
4640
|
data-sort="${c.sort}"
|
|
4630
4641
|
>
|
|
4631
4642
|
${c.name}
|
|
@@ -7,6 +7,12 @@ exports["default"] = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _websyDesignsQlikPluginEs = _interopRequireDefault(require("@websy/websy-designs-qlik-plugin/dist/websy-designs-qlik-plugin-es6"));
|
|
9
9
|
|
|
10
|
+
var d3 = _interopRequireWildcard(require("d3"));
|
|
11
|
+
|
|
12
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
|
|
13
|
+
|
|
14
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
|
|
10
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
17
|
|
|
12
18
|
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
@@ -286,6 +292,9 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
286
292
|
dateFormat: '%_m/%_d/%Y',
|
|
287
293
|
allowClear: true,
|
|
288
294
|
hideRanges: false,
|
|
295
|
+
arrowIcon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z\"/></svg>",
|
|
296
|
+
clearIcon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 512 512\"><line x1=\"368\" y1=\"368\" x2=\"144\" y2=\"144\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/><line x1=\"368\" y1=\"144\" x2=\"144\" y2=\"368\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/></svg>",
|
|
297
|
+
confirmIcon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"30\" height=\"30\" viewBox=\"0 0 512 512\"><polyline points=\"416 128 192 384 96 288\" style=\"fill:none;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/></svg>",
|
|
289
298
|
minAllowedDate: this.floorDate(new Date(new Date(new Date().setFullYear(new Date().getFullYear() - 1)).setDate(1))),
|
|
290
299
|
maxAllowedDate: this.floorDate(new Date(new Date())),
|
|
291
300
|
minAllowedYear: 1970,
|
|
@@ -352,7 +361,7 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
352
361
|
range: [new Date().getFullYear() - 9, DEFAULTS.maxAllowedYear]
|
|
353
362
|
}],
|
|
354
363
|
monthyear: [{
|
|
355
|
-
label: 'All',
|
|
364
|
+
label: 'All Month Years',
|
|
356
365
|
range: [DEFAULTS.minAllowedDate, DEFAULTS.maxAllowedDate]
|
|
357
366
|
}, {
|
|
358
367
|
label: 'Last 12 Months',
|
|
@@ -365,7 +374,7 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
365
374
|
range: [this.floorDate(new Date(new Date(new Date().setDate(1)).setMonth(new Date().getMonth() - 24))), this.floorDate(new Date(new Date().setDate(1)))]
|
|
366
375
|
}],
|
|
367
376
|
hour: [{
|
|
368
|
-
label: 'All',
|
|
377
|
+
label: 'All Hours',
|
|
369
378
|
range: ['00:00', '23:00']
|
|
370
379
|
}]
|
|
371
380
|
};
|
|
@@ -391,13 +400,13 @@ var WebsyDatePicker = /*#__PURE__*/function () {
|
|
|
391
400
|
el.addEventListener('mouseup', this.handleMouseUp.bind(this));
|
|
392
401
|
document.addEventListener('keydown', this.handleKeyDown.bind(this));
|
|
393
402
|
document.addEventListener('keyup', this.handleKeyUp.bind(this));
|
|
394
|
-
var html = "\n <div class='websy-date-picker-container ".concat(this.options.mode, "'>\n <span class='websy-dropdown-header-label'>").concat(this.options.label || 'Date', "</span>\n <div id=\"").concat(this.elementId, "_header\" class='websy-date-picker-header ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n <span id='").concat(this.elementId, "_selectedRange'>").concat(this.options.ranges[this.options.mode][this.selectedRange].label, "</span>\n
|
|
403
|
+
var html = "\n <div class='websy-date-picker-container ".concat(this.options.mode, "'>\n <span class='websy-dropdown-header-label'>").concat(this.options.label || 'Date', "</span>\n <div id=\"").concat(this.elementId, "_header\" class='websy-date-picker-header ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n <span id='").concat(this.elementId, "_selectedRange'>").concat(this.options.ranges[this.options.mode][this.selectedRange].label, "</span>\n ").concat(this.options.arrowIcon, "\n ");
|
|
395
404
|
|
|
396
405
|
if (this.options.allowClear === true) {
|
|
397
|
-
html += "
|
|
406
|
+
html += "<div class='clear-selection'>".concat(this.options.clearIcon, "</div>");
|
|
398
407
|
}
|
|
399
408
|
|
|
400
|
-
html += "\n </div>\n <div id='".concat(this.elementId, "_mask' class='websy-date-picker-mask'></div>\n <div id='").concat(this.elementId, "_content' class='websy-date-picker-content ").concat(this.options.hideRanges === true ? 'hide-ranges' : '', "'>\n <div class='websy-date-picker-ranges' >\n <ul id='").concat(this.elementId, "_rangelist'>\n ").concat(this.renderRanges(), "\n </ul>\n </div><!--\n --><div id='").concat(this.elementId, "_datelist' class='websy-date-picker-custom'>").concat(this.renderDates(), "</div>\n <div class='websy-dp-button-container'>\n <span class=\"dp-footnote\">Click and drag or hold Shift and click to select a range of values</span>\n <button class='").concat(this.options.cancelBtnClasses || '', " websy-btn websy-dp-cancel'>\n
|
|
409
|
+
html += "\n </div>\n <div id='".concat(this.elementId, "_mask' class='websy-date-picker-mask'></div>\n <div id='").concat(this.elementId, "_content' class='websy-date-picker-content ").concat(this.options.hideRanges === true ? 'hide-ranges' : '', "'>\n <div class='websy-date-picker-ranges' >\n <ul id='").concat(this.elementId, "_rangelist'>\n ").concat(this.renderRanges(), "\n </ul>\n </div><!--\n --><div id='").concat(this.elementId, "_datelist' class='websy-date-picker-custom'>").concat(this.renderDates(), "</div>\n <div class='websy-dp-button-container'>\n <span class=\"dp-footnote\">Click and drag or hold Shift and click to select a range of values</span>\n <button class='").concat(this.options.cancelBtnClasses || '', " websy-btn websy-dp-cancel'>\n ").concat(this.options.clearIcon, "\n </button>\n <button class='").concat(this.options.confirmBtnClasses || '', " websy-btn websy-dp-confirm'>\n ").concat(this.options.confirmIcon, "\n </button>\n </div>\n </div> \n </div>\n ");
|
|
401
410
|
el.innerHTML = html;
|
|
402
411
|
this.render();
|
|
403
412
|
} else {
|
|
@@ -1228,7 +1237,11 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1228
1237
|
minSearchCharacters: 2,
|
|
1229
1238
|
showCompleteSelectedList: false,
|
|
1230
1239
|
closeAfterSelection: true,
|
|
1231
|
-
customActions: []
|
|
1240
|
+
customActions: [],
|
|
1241
|
+
searchIcon: "<svg class='search' width=\"20\" height=\"20\" viewBox=\"0 0 512 512\"><path d=\"M221.09,64A157.09,157.09,0,1,0,378.18,221.09,157.1,157.1,0,0,0,221.09,64Z\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"/><line x1=\"338.29\" y1=\"338.29\" x2=\"448\" y2=\"448\" style=\"fill:none;stroke:#000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px\"/></svg>",
|
|
1242
|
+
clearIcon: "<svg class='clear' xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 512 512\"><title>ionicons-v5-l</title><line x1=\"368\" y1=\"368\" x2=\"144\" y2=\"144\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/><line x1=\"368\" y1=\"144\" x2=\"144\" y2=\"368\" style=\"fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px\"/></svg>",
|
|
1243
|
+
arrowIcon: "<svg class='arrow' xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z\"/></svg>",
|
|
1244
|
+
actionsIcon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"30\" height=\"30\" viewBox=\"0 0 512 512\">><circle cx=\"256\" cy=\"256\" r=\"32\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"/><circle cx=\"416\" cy=\"256\" r=\"32\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"/><circle cx=\"96\" cy=\"256\" r=\"32\" style=\"fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px\"/></svg>"
|
|
1232
1245
|
};
|
|
1233
1246
|
this.options = _extends({}, DEFAULTS, options);
|
|
1234
1247
|
|
|
@@ -1262,16 +1275,16 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1262
1275
|
var headerValue = this.selectedItems.map(function (s) {
|
|
1263
1276
|
return _this8.options.items[s].value || _this8.options.items[s].label;
|
|
1264
1277
|
}).join(this.options.multiValueDelimiter);
|
|
1265
|
-
var html = "\n <div id='".concat(this.elementId, "_container' class='websy-dropdown-container ").concat(this.options.disabled ? 'disabled' : '', " ").concat(this.options.disableSearch !== true ? 'with-search' : '', " ").concat(this.options.style, " ").concat(this.options.customActions.length > 0 ? 'with-actions' : '', "'>\n <div id='").concat(this.elementId, "_header' class='websy-dropdown-header ").concat(this.selectedItems.length === 1 ? 'one-selected' : '', " ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n
|
|
1278
|
+
var html = "\n <div id='".concat(this.elementId, "_container' class='websy-dropdown-container ").concat(this.options.disabled ? 'disabled' : '', " ").concat(this.options.disableSearch !== true ? 'with-search' : '', " ").concat(this.options.style, " ").concat(this.options.customActions.length > 0 ? 'with-actions' : '', "'>\n <div id='").concat(this.elementId, "_header' class='websy-dropdown-header ").concat(this.selectedItems.length === 1 ? 'one-selected' : '', " ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n ").concat(this.options.searchIcon, "\n <span>\n <span class='websy-dropdown-header-value' data-info='").concat(headerLabel, "' id='").concat(this.elementId, "_selectedItems'>").concat(headerLabel, "</span> \n <span class='websy-dropdown-header-label' id='").concat(this.elementId, "_headerLabel'>").concat(this.options.label, "</span>\n </span>\n <input class='dropdown-input' id='").concat(this.elementId, "_input' name='").concat(this.options.field || this.options.label, "' value='").concat(headerValue, "'>\n ").concat(this.options.arrowIcon, "\n ");
|
|
1266
1279
|
|
|
1267
1280
|
if (this.options.allowClear === true) {
|
|
1268
|
-
html +=
|
|
1281
|
+
html += this.options.clearIcon;
|
|
1269
1282
|
}
|
|
1270
1283
|
|
|
1271
1284
|
html += " \n </div>\n <div id='".concat(this.elementId, "_mask' class='websy-dropdown-mask'></div>\n <div id='").concat(this.elementId, "_content' class='websy-dropdown-content'>\n ");
|
|
1272
1285
|
|
|
1273
1286
|
if (this.options.customActions.length > 0) {
|
|
1274
|
-
html += "\n <div class='websy-dropdown-action-container'>\n <button class='websy-dropdown-action-button'>\n
|
|
1287
|
+
html += "\n <div class='websy-dropdown-action-container'>\n ".concat(this.options.actionsTitle || '', "\n <button class='websy-dropdown-action-button'>\n ").concat(this.options.actionsIcon, "\n </button>\n <ul id='").concat(this.elementId, "_actionContainer'>\n ");
|
|
1275
1288
|
this.options.customActions.forEach(function (a, i) {
|
|
1276
1289
|
html += "\n <li class='websy-dropdown-custom-action' data-index='".concat(i, "'>").concat(a.label, "</li>\n ");
|
|
1277
1290
|
});
|
|
@@ -1279,7 +1292,7 @@ var WebsyDropdown = /*#__PURE__*/function () {
|
|
|
1279
1292
|
}
|
|
1280
1293
|
|
|
1281
1294
|
if (this.options.disableSearch !== true) {
|
|
1282
|
-
html += "\n <input id='".concat(this.elementId, "_search' class='websy-dropdown-search' placeholder='").concat(this.options.searchPlaceholder || 'Search', "'>\n ");
|
|
1295
|
+
html += "\n <div class='websy-dropdown-search-container'>\n <input id='".concat(this.elementId, "_search' class='websy-dropdown-search' placeholder='").concat(this.options.searchPlaceholder || 'Search', "'>\n </div>\n ");
|
|
1283
1296
|
}
|
|
1284
1297
|
|
|
1285
1298
|
html += "\n <div id='".concat(this.elementId, "_itemsContainer' class='websy-dropdown-items'>\n <ul id='").concat(this.elementId, "_items'> \n </ul>\n </div><!--\n --><div class='websy-dropdown-custom'></div>\n </div>\n </div>\n ");
|
|
@@ -4874,10 +4887,11 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4874
4887
|
|
|
4875
4888
|
if (event.target.classList.contains('sortable-column')) {
|
|
4876
4889
|
var colIndex = +event.target.getAttribute('data-index');
|
|
4890
|
+
var sortIndex = +event.target.getAttribute('data-sort-index');
|
|
4877
4891
|
var column = this.options.columns[colIndex];
|
|
4878
4892
|
|
|
4879
4893
|
if (this.options.onSort) {
|
|
4880
|
-
this.options.onSort(event, column, colIndex);
|
|
4894
|
+
this.options.onSort(event, column, colIndex, sortIndex);
|
|
4881
4895
|
} else {
|
|
4882
4896
|
this.internalSort(column, colIndex);
|
|
4883
4897
|
} // const colIndex = +event.target.getAttribute('data-index')
|
|
@@ -5124,7 +5138,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
5124
5138
|
style += "width: ".concat(c.width || 'auto', "; ");
|
|
5125
5139
|
}
|
|
5126
5140
|
|
|
5127
|
-
return "\n <th style=\"".concat(style, "\">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-index=\"").concat(i, "\" \n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n ").concat(c.searchable === true ? _this33.buildSearchIcon(i) : '', "\n </div>\n </th>\n ");
|
|
5141
|
+
return "\n <th style=\"".concat(style, "\">\n <div class =\"tableHeader\">\n <div class=\"leftSection\">\n <div\n class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n data-sort-index=\"").concat(c.sortIndex || i, "\"\n data-index=\"").concat(i, "\"\n data-sort=\"").concat(c.sort, "\" \n >\n ").concat(c.name, "\n </div>\n </div>\n <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n ").concat(c.searchable === true ? _this33.buildSearchIcon(i) : '', "\n </div>\n </th>\n ");
|
|
5128
5142
|
}
|
|
5129
5143
|
}).join('') + '</tr>';
|
|
5130
5144
|
var headEl = document.getElementById("".concat(this.elementId, "_head"));
|