@websy/websy-designs 1.2.24 → 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 +14 -10
- package/dist/websy-designs-es6.js +17 -7
- package/dist/websy-designs-es6.min.js +1 -1
- package/dist/websy-designs.debug.js +13 -10
- package/dist/websy-designs.js +11 -7
- 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>
|
|
@@ -4418,9 +4420,10 @@ class WebsyTable2 {
|
|
|
4418
4420
|
}
|
|
4419
4421
|
if (event.target.classList.contains('sortable-column')) {
|
|
4420
4422
|
const colIndex = +event.target.getAttribute('data-index')
|
|
4423
|
+
const sortIndex = +event.target.getAttribute('data-sort-index')
|
|
4421
4424
|
const column = this.options.columns[colIndex]
|
|
4422
4425
|
if (this.options.onSort) {
|
|
4423
|
-
this.options.onSort(event, column, colIndex)
|
|
4426
|
+
this.options.onSort(event, column, colIndex, sortIndex)
|
|
4424
4427
|
}
|
|
4425
4428
|
else {
|
|
4426
4429
|
this.internalSort(column, colIndex)
|
|
@@ -4632,7 +4635,8 @@ class WebsyTable2 {
|
|
|
4632
4635
|
<div class="leftSection">
|
|
4633
4636
|
<div
|
|
4634
4637
|
class="tableHeaderField ${['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : ''}"
|
|
4635
|
-
data-index="${i}"
|
|
4638
|
+
data-sort-index="${c.sortIndex || i}"
|
|
4639
|
+
data-index="${i}"
|
|
4636
4640
|
data-sort="${c.sort}"
|
|
4637
4641
|
>
|
|
4638
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 {
|
|
@@ -4878,10 +4887,11 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
4878
4887
|
|
|
4879
4888
|
if (event.target.classList.contains('sortable-column')) {
|
|
4880
4889
|
var colIndex = +event.target.getAttribute('data-index');
|
|
4890
|
+
var sortIndex = +event.target.getAttribute('data-sort-index');
|
|
4881
4891
|
var column = this.options.columns[colIndex];
|
|
4882
4892
|
|
|
4883
4893
|
if (this.options.onSort) {
|
|
4884
|
-
this.options.onSort(event, column, colIndex);
|
|
4894
|
+
this.options.onSort(event, column, colIndex, sortIndex);
|
|
4885
4895
|
} else {
|
|
4886
4896
|
this.internalSort(column, colIndex);
|
|
4887
4897
|
} // const colIndex = +event.target.getAttribute('data-index')
|
|
@@ -5128,7 +5138,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
|
|
|
5128
5138
|
style += "width: ".concat(c.width || 'auto', "; ");
|
|
5129
5139
|
}
|
|
5130
5140
|
|
|
5131
|
-
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 ");
|
|
5132
5142
|
}
|
|
5133
5143
|
}).join('') + '</tr>';
|
|
5134
5144
|
var headEl = document.getElementById("".concat(this.elementId, "_head"));
|