@zeedhi/vuetify 1.79.1 → 1.80.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/zd-vuetify.esm.js +142 -26
- package/dist/zd-vuetify.umd.js +142 -26
- package/package.json +2 -2
- package/types/components/zd-apex-chart/ZdApexChart.d.ts +6 -0
- package/types/components/zd-date/ZdDate.d.ts +2 -0
- package/types/components/zd-date/ZdDateRange.d.ts +2 -0
- package/types/components/zd-modal/ZdModal.d.ts +7 -5
- package/types/components/zd-tabs/ZdTabs.d.ts +1 -0
- package/types/components/zd-text/ZdText.d.ts +8 -1
package/dist/zd-vuetify.esm.js
CHANGED
|
@@ -38194,8 +38194,10 @@ let ZdApexChart = class ZdApexChart extends ZdComponentRender$1 {
|
|
|
38194
38194
|
constructor() {
|
|
38195
38195
|
super(...arguments);
|
|
38196
38196
|
this.instanceType = ApexChart;
|
|
38197
|
+
this.breakpoints = [];
|
|
38197
38198
|
}
|
|
38198
38199
|
mounted() {
|
|
38200
|
+
var _a, _b;
|
|
38199
38201
|
this.setApexChartTheme();
|
|
38200
38202
|
const updateFn = this.updateChart;
|
|
38201
38203
|
this.instance.setViewUpdate(updateFn);
|
|
@@ -38203,6 +38205,17 @@ let ZdApexChart = class ZdApexChart extends ZdComponentRender$1 {
|
|
|
38203
38205
|
if (this.instance.fillHeight) {
|
|
38204
38206
|
setFillHeight(this.$el);
|
|
38205
38207
|
}
|
|
38208
|
+
this.defaultOptions = Object.assign({}, this.$refs.instance.chart.w.config);
|
|
38209
|
+
this.breakpoints = ((_b = (_a = this.instance.options) === null || _a === void 0 ? void 0 : _a.parentResponsive) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.breakpoint - b.breakpoint)) || [];
|
|
38210
|
+
this.apexChartContainer = this.$refs.chartContainer;
|
|
38211
|
+
if (this.breakpoints.length) {
|
|
38212
|
+
this.resizeObserver = new ResizeObserver(this.handleResize);
|
|
38213
|
+
this.resizeObserver.observe(this.apexChartContainer);
|
|
38214
|
+
}
|
|
38215
|
+
}
|
|
38216
|
+
beforeDestroy() {
|
|
38217
|
+
var _a;
|
|
38218
|
+
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
38206
38219
|
}
|
|
38207
38220
|
updateChart(options) {
|
|
38208
38221
|
return new Promise((resolve) => {
|
|
@@ -38226,6 +38239,17 @@ let ZdApexChart = class ZdApexChart extends ZdComponentRender$1 {
|
|
|
38226
38239
|
} });
|
|
38227
38240
|
this.instance.options = newOptions;
|
|
38228
38241
|
}
|
|
38242
|
+
handleResize() {
|
|
38243
|
+
if (!this.breakpoints.length)
|
|
38244
|
+
return;
|
|
38245
|
+
const matchedOptions = this.breakpoints.find((bp) => this.apexChartContainer.clientWidth <= bp.breakpoint);
|
|
38246
|
+
if (matchedOptions) {
|
|
38247
|
+
this.instance.updateChart(matchedOptions.options);
|
|
38248
|
+
}
|
|
38249
|
+
else if (this.instance.options !== this.defaultOptions) {
|
|
38250
|
+
this.instance.updateChart(this.defaultOptions);
|
|
38251
|
+
}
|
|
38252
|
+
}
|
|
38229
38253
|
drillUp() {
|
|
38230
38254
|
this.instance.drillUp();
|
|
38231
38255
|
}
|
|
@@ -38298,6 +38322,7 @@ var __vue_render__$1t = function () {
|
|
|
38298
38322
|
return _c(
|
|
38299
38323
|
"div",
|
|
38300
38324
|
{
|
|
38325
|
+
ref: "chartContainer",
|
|
38301
38326
|
staticClass: "apexcharts-container",
|
|
38302
38327
|
style: {
|
|
38303
38328
|
height: _vm.$formatSize(_vm.instance.height),
|
|
@@ -38394,7 +38419,7 @@ __vue_render__$1t._withStripped = true;
|
|
|
38394
38419
|
/* style */
|
|
38395
38420
|
const __vue_inject_styles__$1t = function (inject) {
|
|
38396
38421
|
if (!inject) return
|
|
38397
|
-
inject("data-v-
|
|
38422
|
+
inject("data-v-51426e9c_0", { source: ".zd-apex-chart.zd-apex-chart-drilled svg text.apexcharts-title-text {\n transform: translateX(20px);\n}\n.zd-apex-chart .apexcharts-toolbar {\n z-index: 0;\n}\n.zd-apex-chart .apexcharts-toolbar > div {\n transform: scale(0.8) !important;\n}\n.zd-apex-chart.theme--light .apexcharts-toolbar > div > .v-icon {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip {\n background: #fdfdfd !important;\n border: 1px solid #fdfdfd !important;\n color: #3b3b3b !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #eee !important;\n color: #3b3b3b !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--light .apexcharts-title-text {\n fill: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip {\n background: #eee !important;\n border: 1px solid #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-toolbar > div > .v-icon {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip {\n background: #1e1e1e !important;\n border: 1px solid #1e1e1e !important;\n color: #b8b8b8 !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #101010 !important;\n color: #b8b8b8 !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-title-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip {\n background: #101010 !important;\n border: 1px solid #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #252525 !important;\n}\n.apexcharts-overlay {\n z-index: 0 !important;\n}\n.apexcharts-container {\n position: relative;\n overflow: hidden !important;\n}\n.apexcharts-container .zd-apex-charts-drill-button {\n position: absolute;\n top: 0px;\n left: 0px;\n}", map: undefined, media: undefined });
|
|
38398
38423
|
|
|
38399
38424
|
};
|
|
38400
38425
|
/* scoped */
|
|
@@ -42560,13 +42585,14 @@ let ZdDate = class ZdDate extends __vue_component__$1f {
|
|
|
42560
42585
|
this.instance.selectDate(date, event, this.$el);
|
|
42561
42586
|
}
|
|
42562
42587
|
getAllowedDates(date) {
|
|
42588
|
+
const parsedDate = this.instance.parseISODateValue(date);
|
|
42563
42589
|
if (typeof this.instance.allowedDates === 'function') {
|
|
42564
|
-
return this.instance.allowedDates(
|
|
42590
|
+
return this.instance.allowedDates(parsedDate);
|
|
42565
42591
|
}
|
|
42566
42592
|
if (typeof this.instance.allowedDates === 'undefined') {
|
|
42567
42593
|
return true;
|
|
42568
42594
|
}
|
|
42569
|
-
return this.instance.allowedDates.indexOf(
|
|
42595
|
+
return this.instance.allowedDates.indexOf(parsedDate) !== -1;
|
|
42570
42596
|
}
|
|
42571
42597
|
isPrintableKey(key) {
|
|
42572
42598
|
return !!key && key.length === 1;
|
|
@@ -42709,6 +42735,14 @@ __decorate([
|
|
|
42709
42735
|
PropWatch({ type: String, default: '' }),
|
|
42710
42736
|
__metadata("design:type", String)
|
|
42711
42737
|
], ZdDate.prototype, "helperValue", void 0);
|
|
42738
|
+
__decorate([
|
|
42739
|
+
PropWatch({ type: String, default: '' }),
|
|
42740
|
+
__metadata("design:type", String)
|
|
42741
|
+
], ZdDate.prototype, "max", void 0);
|
|
42742
|
+
__decorate([
|
|
42743
|
+
PropWatch({ type: String, default: '' }),
|
|
42744
|
+
__metadata("design:type", String)
|
|
42745
|
+
], ZdDate.prototype, "min", void 0);
|
|
42712
42746
|
ZdDate = __decorate([
|
|
42713
42747
|
Component$1
|
|
42714
42748
|
], ZdDate);
|
|
@@ -42844,6 +42878,8 @@ var __vue_render__$1b = function () {
|
|
|
42844
42878
|
showWeek: _vm.instance.showWeek,
|
|
42845
42879
|
type: _vm.instance.pickerType,
|
|
42846
42880
|
width: _vm.$isMobile() ? "290px" : _vm.instance.width,
|
|
42881
|
+
max: _vm.instance.formatISODateValue(_vm.instance.max),
|
|
42882
|
+
min: _vm.instance.formatISODateValue(_vm.instance.min),
|
|
42847
42883
|
},
|
|
42848
42884
|
false
|
|
42849
42885
|
),
|
|
@@ -42962,7 +42998,7 @@ __vue_render__$1b._withStripped = true;
|
|
|
42962
42998
|
/* style */
|
|
42963
42999
|
const __vue_inject_styles__$1b = function (inject) {
|
|
42964
43000
|
if (!inject) return
|
|
42965
|
-
inject("data-v-
|
|
43001
|
+
inject("data-v-34d81b8c_0", { source: "div.v-picker--date .v-picker__body {\n background: transparent;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header {\n padding: var(--spacing-2) var(--spacing-4) var(--spacing-1) var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div button:not(:hover):not(:focus) {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-btn--icon {\n height: var(--icon-size);\n width: var(--icon-size);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value button {\n padding: 0;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table {\n margin-bottom: 12px;\n padding: 0 var(--spacing-4);\n height: 200px;\n margin-bottom: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table .v-btn.v-btn--active {\n color: var(--v-secondary-lighten4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--date .v-btn {\n width: 24px;\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month {\n padding-top: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month .v-btn {\n padding: 4px 0 7px 0;\n height: 24px;\n width: 56px;\n min-width: 56px;\n border-radius: var(--border);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month td {\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month tr:not(:last-child) td {\n padding-bottom: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table thead th {\n color: var(--zd-font-disabled-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent--text {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent {\n background: var(--zd-primary-base) !important;\n color: white !important;\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li.primary--text {\n color: var(--zd-primary-base) !important;\n}\n.zd-date-menu-activator .v-menu__activator.v-menu__activator--disabled {\n cursor: default;\n}\n.date-helper-values-button {\n height: 24px !important;\n margin-left: 5px;\n margin-top: 0;\n}\n.date-helper-values-button.with-label {\n margin-top: 20px;\n}\n.date-helper-values-option {\n cursor: pointer;\n}\n.date-helper-values-option:hover {\n background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
|
|
42966
43002
|
|
|
42967
43003
|
};
|
|
42968
43004
|
/* scoped */
|
|
@@ -43205,6 +43241,14 @@ __decorate([
|
|
|
43205
43241
|
PropWatch({ type: [String, Array], default: () => [] }),
|
|
43206
43242
|
__metadata("design:type", Object)
|
|
43207
43243
|
], ZdDateRange.prototype, "value", void 0);
|
|
43244
|
+
__decorate([
|
|
43245
|
+
PropWatch({ type: String, default: '' }),
|
|
43246
|
+
__metadata("design:type", String)
|
|
43247
|
+
], ZdDateRange.prototype, "max", void 0);
|
|
43248
|
+
__decorate([
|
|
43249
|
+
PropWatch({ type: String, default: '' }),
|
|
43250
|
+
__metadata("design:type", String)
|
|
43251
|
+
], ZdDateRange.prototype, "min", void 0);
|
|
43208
43252
|
ZdDateRange = __decorate([
|
|
43209
43253
|
Component$1
|
|
43210
43254
|
], ZdDateRange);
|
|
@@ -43346,6 +43390,12 @@ var __vue_render__$1a = function () {
|
|
|
43346
43390
|
showWeek: _vm.instance.showWeek,
|
|
43347
43391
|
type: _vm.instance.pickerType,
|
|
43348
43392
|
width: _vm.$isMobile() ? "290px" : _vm.instance.width,
|
|
43393
|
+
max: _vm.instance.formatISODateRangeValue(
|
|
43394
|
+
_vm.instance.max
|
|
43395
|
+
)[0],
|
|
43396
|
+
min: _vm.instance.formatISODateRangeValue(
|
|
43397
|
+
_vm.instance.min
|
|
43398
|
+
)[0],
|
|
43349
43399
|
},
|
|
43350
43400
|
false
|
|
43351
43401
|
),
|
|
@@ -43465,7 +43515,7 @@ __vue_render__$1a._withStripped = true;
|
|
|
43465
43515
|
/* style */
|
|
43466
43516
|
const __vue_inject_styles__$1a = function (inject) {
|
|
43467
43517
|
if (!inject) return
|
|
43468
|
-
inject("data-v-
|
|
43518
|
+
inject("data-v-137a58b0_0", { source: "div.v-picker--date .v-picker__body {\n background: transparent;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header {\n padding: var(--spacing-2) var(--spacing-4) var(--spacing-1) var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div button:not(:hover):not(:focus) {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-btn--icon {\n height: var(--icon-size);\n width: var(--icon-size);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value button {\n padding: 0;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table {\n margin-bottom: 12px;\n padding: 0 var(--spacing-4);\n height: 200px;\n margin-bottom: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table .v-btn.v-btn--active {\n color: var(--v-secondary-lighten4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--date .v-btn {\n width: 24px;\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month {\n padding-top: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month .v-btn {\n padding: 4px 0 7px 0;\n height: 24px;\n width: 56px;\n min-width: 56px;\n border-radius: var(--border);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month td {\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month tr:not(:last-child) td {\n padding-bottom: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table thead th {\n color: var(--zd-font-disabled-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent--text {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent {\n background: var(--zd-primary-base) !important;\n color: white !important;\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li.primary--text {\n color: var(--zd-primary-base) !important;\n}\n.zd-date-menu-activator .v-menu__activator.v-menu__activator--disabled {\n cursor: default;\n}\n.date-range-helper-values-button {\n height: 24px !important;\n margin-left: 5px;\n margin-top: 0;\n}\n.date-range-helper-values-button.with-label {\n margin-top: 20px;\n}\n.date-range-helper-values-option {\n cursor: pointer;\n}\n.date-range-helper-values-option:hover {\n background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
|
|
43469
43519
|
|
|
43470
43520
|
};
|
|
43471
43521
|
/* scoped */
|
|
@@ -53692,7 +53742,7 @@ let ZdModal = class ZdModal extends ZdComponent$1 {
|
|
|
53692
53742
|
const el = (Array.isArray(ref) ? ref[0].$el : ref === null || ref === void 0 ? void 0 : ref.$el);
|
|
53693
53743
|
return el || null;
|
|
53694
53744
|
}
|
|
53695
|
-
|
|
53745
|
+
registerDragEvents(modal) {
|
|
53696
53746
|
const el = this.getModalEl(modal);
|
|
53697
53747
|
if (!el)
|
|
53698
53748
|
return;
|
|
@@ -53705,11 +53755,28 @@ let ZdModal = class ZdModal extends ZdComponent$1 {
|
|
|
53705
53755
|
if (!this.dragHandle)
|
|
53706
53756
|
return;
|
|
53707
53757
|
this.dragHandle.addEventListener('mousedown', this.dragStart.bind(this, modal));
|
|
53758
|
+
this.dragHandle.addEventListener('touchstart', this.dragStart.bind(this, modal), { passive: false });
|
|
53708
53759
|
}
|
|
53709
|
-
|
|
53760
|
+
unregisterDragEvents(modal) {
|
|
53710
53761
|
if (!this.dragHandle)
|
|
53711
53762
|
return;
|
|
53712
53763
|
this.dragHandle.removeEventListener('mousedown', this.dragStart.bind(this, modal));
|
|
53764
|
+
this.dragHandle.removeEventListener('touchstart', this.dragStart.bind(this, modal));
|
|
53765
|
+
}
|
|
53766
|
+
isTouchEvent(event) {
|
|
53767
|
+
return 'touches' in event;
|
|
53768
|
+
}
|
|
53769
|
+
getEventCoordinates(event) {
|
|
53770
|
+
if (this.isTouchEvent(event)) {
|
|
53771
|
+
return {
|
|
53772
|
+
x: event.touches[0].clientX,
|
|
53773
|
+
y: event.touches[0].clientY,
|
|
53774
|
+
};
|
|
53775
|
+
}
|
|
53776
|
+
return {
|
|
53777
|
+
x: event.clientX,
|
|
53778
|
+
y: event.clientY,
|
|
53779
|
+
};
|
|
53713
53780
|
}
|
|
53714
53781
|
dragStart(modal, event) {
|
|
53715
53782
|
var _a, _b;
|
|
@@ -53717,26 +53784,35 @@ let ZdModal = class ZdModal extends ZdComponent$1 {
|
|
|
53717
53784
|
return;
|
|
53718
53785
|
const dragHandle = (_a = modal.dragHandle) === null || _a === void 0 ? void 0 : _a.replace('.', '');
|
|
53719
53786
|
const targetElement = event.target;
|
|
53720
|
-
const isDragHandleInvalid = dragHandle && !targetElement.
|
|
53787
|
+
const isDragHandleInvalid = dragHandle && !targetElement.classList.contains(dragHandle);
|
|
53721
53788
|
if (isDragHandleInvalid) {
|
|
53722
53789
|
return;
|
|
53723
53790
|
}
|
|
53724
53791
|
const isEventTargetInvalid = event && event.target && !((_b = event.target
|
|
53725
|
-
.parentElement) === null || _b === void 0 ? void 0 : _b.
|
|
53792
|
+
.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains(`zd-modal-card-${modal.name}`));
|
|
53726
53793
|
const isDragHandleMissing = !dragHandle;
|
|
53727
53794
|
if (isEventTargetInvalid && isDragHandleMissing) {
|
|
53728
53795
|
return;
|
|
53729
53796
|
}
|
|
53730
53797
|
this.modalDragged = modal;
|
|
53731
|
-
|
|
53732
|
-
this.
|
|
53733
|
-
|
|
53734
|
-
|
|
53798
|
+
const { x, y } = this.getEventCoordinates(event);
|
|
53799
|
+
this.x = x;
|
|
53800
|
+
this.y = y;
|
|
53801
|
+
if (this.isTouchEvent(event)) {
|
|
53802
|
+
document.addEventListener('touchmove', this.dragMove, { passive: false });
|
|
53803
|
+
document.addEventListener('touchend', this.dragEnd);
|
|
53804
|
+
}
|
|
53805
|
+
else {
|
|
53806
|
+
document.addEventListener('mousemove', this.dragMove);
|
|
53807
|
+
document.addEventListener('mouseup', this.dragEnd);
|
|
53808
|
+
}
|
|
53735
53809
|
}
|
|
53736
53810
|
dragEnd() {
|
|
53737
53811
|
this.modalDragged = undefined;
|
|
53738
53812
|
document.removeEventListener('mousemove', this.dragMove);
|
|
53739
53813
|
document.removeEventListener('mouseup', this.dragEnd);
|
|
53814
|
+
document.removeEventListener('touchmove', this.dragMove);
|
|
53815
|
+
document.removeEventListener('touchend', this.dragEnd);
|
|
53740
53816
|
}
|
|
53741
53817
|
dragMove(event) {
|
|
53742
53818
|
var _a;
|
|
@@ -53746,8 +53822,9 @@ let ZdModal = class ZdModal extends ZdComponent$1 {
|
|
|
53746
53822
|
if (!modalEl)
|
|
53747
53823
|
return;
|
|
53748
53824
|
event.preventDefault();
|
|
53749
|
-
const
|
|
53750
|
-
const
|
|
53825
|
+
const { x, y } = this.getEventCoordinates(event);
|
|
53826
|
+
const dy = y - this.y;
|
|
53827
|
+
const dx = x - this.x;
|
|
53751
53828
|
const toNum = (str) => Number(str.slice(0, -2));
|
|
53752
53829
|
const toPx = (num) => `${num}px`;
|
|
53753
53830
|
const threshold = 1;
|
|
@@ -53762,8 +53839,8 @@ let ZdModal = class ZdModal extends ZdComponent$1 {
|
|
|
53762
53839
|
&& (window.innerWidth / 2) - 2 * (left + dx) >= 0) {
|
|
53763
53840
|
modalEl.style.left = toPx(left + dx);
|
|
53764
53841
|
}
|
|
53765
|
-
this.x =
|
|
53766
|
-
this.y =
|
|
53842
|
+
this.x = x;
|
|
53843
|
+
this.y = y;
|
|
53767
53844
|
}
|
|
53768
53845
|
}
|
|
53769
53846
|
getContentClass(modal) {
|
|
@@ -53857,10 +53934,10 @@ var __vue_render__$u = function () {
|
|
|
53857
53934
|
style: modal.cssStyle,
|
|
53858
53935
|
on: {
|
|
53859
53936
|
"hook:mounted": function ($event) {
|
|
53860
|
-
modal.draggable && _vm.
|
|
53937
|
+
modal.draggable && _vm.registerDragEvents(modal);
|
|
53861
53938
|
},
|
|
53862
53939
|
"hook:destroyed": function ($event) {
|
|
53863
|
-
return _vm.
|
|
53940
|
+
return _vm.unregisterDragEvents(modal)
|
|
53864
53941
|
},
|
|
53865
53942
|
},
|
|
53866
53943
|
},
|
|
@@ -53924,7 +54001,7 @@ __vue_render__$u._withStripped = true;
|
|
|
53924
54001
|
/* style */
|
|
53925
54002
|
const __vue_inject_styles__$u = function (inject) {
|
|
53926
54003
|
if (!inject) return
|
|
53927
|
-
inject("data-v-
|
|
54004
|
+
inject("data-v-12867ee3_0", { source: ".zd-modal-title {\n padding-bottom: 0px;\n}\n.zd-modal-container {\n padding: 0;\n cursor: default;\n}\n.zd-modal-flex {\n width: 100%;\n}\n.zd-modal-draggable {\n position: relative;\n}\n.zd-modal-draggable-handle {\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab;\n}\n.zd-modal-draggable-handle:active {\n cursor: grabbing;\n cursor: -moz-grabbing;\n cursor: -webkit-grabbing;\n}\n.zd-modal-content > .zd-modal-card > .zd-modal-title {\n padding: var(--zd-default-padding);\n padding-bottom: 0px;\n font-size: var(--zd-font-title-size);\n font-weight: var(--zd-font-title-weight);\n color: var(--zd-font-color);\n}\n.zd-modal-content > .zd-modal-card > .zd-modal-card-text {\n padding: var(--zd-default-padding);\n display: flex;\n flex: 1 1 auto;\n}", map: undefined, media: undefined });
|
|
53928
54005
|
|
|
53929
54006
|
};
|
|
53930
54007
|
/* scoped */
|
|
@@ -57690,6 +57767,9 @@ let ZdTabs = class ZdTabs extends ZdComponentRender$1 {
|
|
|
57690
57767
|
if (this.instance.fillHeight) {
|
|
57691
57768
|
setFillHeight(this.$el);
|
|
57692
57769
|
}
|
|
57770
|
+
I18n.registerChangeListener(() => {
|
|
57771
|
+
this.$refs.tabs.callSlider();
|
|
57772
|
+
});
|
|
57693
57773
|
}
|
|
57694
57774
|
};
|
|
57695
57775
|
__decorate([
|
|
@@ -57712,6 +57792,10 @@ __decorate([
|
|
|
57712
57792
|
PropWatch({ type: [Boolean, String], default: false }),
|
|
57713
57793
|
__metadata("design:type", Object)
|
|
57714
57794
|
], ZdTabs.prototype, "fillHeight", void 0);
|
|
57795
|
+
__decorate([
|
|
57796
|
+
PropWatch({ type: [Boolean, String], default: false }),
|
|
57797
|
+
__metadata("design:type", Boolean)
|
|
57798
|
+
], ZdTabs.prototype, "touchless", void 0);
|
|
57715
57799
|
__decorate([
|
|
57716
57800
|
Prop({ type: Array, default: () => [] }),
|
|
57717
57801
|
__metadata("design:type", Array)
|
|
@@ -57756,6 +57840,7 @@ var __vue_render__$c = function () {
|
|
|
57756
57840
|
_c(
|
|
57757
57841
|
"v-tabs",
|
|
57758
57842
|
{
|
|
57843
|
+
ref: "tabs",
|
|
57759
57844
|
attrs: {
|
|
57760
57845
|
"show-arrows": "",
|
|
57761
57846
|
dark: _vm.instance.dark,
|
|
@@ -57818,7 +57903,11 @@ var __vue_render__$c = function () {
|
|
|
57818
57903
|
_c(
|
|
57819
57904
|
"v-tabs-items",
|
|
57820
57905
|
{
|
|
57821
|
-
attrs: {
|
|
57906
|
+
attrs: {
|
|
57907
|
+
dark: _vm.instance.dark,
|
|
57908
|
+
light: _vm.instance.light,
|
|
57909
|
+
touchless: _vm.instance.touchless,
|
|
57910
|
+
},
|
|
57822
57911
|
model: {
|
|
57823
57912
|
value: _vm.instance.activeTab,
|
|
57824
57913
|
callback: function ($$v) {
|
|
@@ -57874,11 +57963,11 @@ __vue_render__$c._withStripped = true;
|
|
|
57874
57963
|
/* style */
|
|
57875
57964
|
const __vue_inject_styles__$c = function (inject) {
|
|
57876
57965
|
if (!inject) return
|
|
57877
|
-
inject("data-v-
|
|
57966
|
+
inject("data-v-f3ce5dca_0", { source: ".zd-tabs[data-v-f3ce5dca] {\n display: flex;\n flex-direction: column;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar,\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items {\n background-color: transparent;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar {\n height: auto;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar .v-tabs-slider-wrapper {\n bottom: -1px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar__content {\n border-bottom: solid 1px var(--v-grey-lighten4);\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs {\n margin-bottom: var(--spacing-4);\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__next,\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__prev {\n flex-basis: 30px;\n min-width: 30px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__next .v-icon,\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__prev .v-icon {\n font-size: 18px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs {\n flex-grow: 0;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items {\n flex-grow: 1;\n overflow-y: auto;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items .v-window__container {\n height: 100% !important;\n}", map: undefined, media: undefined });
|
|
57878
57967
|
|
|
57879
57968
|
};
|
|
57880
57969
|
/* scoped */
|
|
57881
|
-
const __vue_scope_id__$c = "data-v-
|
|
57970
|
+
const __vue_scope_id__$c = "data-v-f3ce5dca";
|
|
57882
57971
|
/* module identifier */
|
|
57883
57972
|
const __vue_module_identifier__$c = undefined;
|
|
57884
57973
|
/* functional template */
|
|
@@ -58246,6 +58335,29 @@ let ZdText = class ZdText extends ZdComponent$1 {
|
|
|
58246
58335
|
constructor() {
|
|
58247
58336
|
super(...arguments);
|
|
58248
58337
|
this.instanceType = Text;
|
|
58338
|
+
this.parentWidth = 0;
|
|
58339
|
+
}
|
|
58340
|
+
handleResize() {
|
|
58341
|
+
if (this.parentWidth && this.textResize.fontSize) {
|
|
58342
|
+
const proportion = this.parentElement.clientWidth / this.parentWidth;
|
|
58343
|
+
const MIN = this.textResize.min || 0;
|
|
58344
|
+
const MAX = this.textResize.max || Infinity;
|
|
58345
|
+
this.$el.style.fontSize = `${Math.min(Math.max(this.textResize.fontSize * proportion, MIN), MAX)}px`;
|
|
58346
|
+
}
|
|
58347
|
+
}
|
|
58348
|
+
mounted() {
|
|
58349
|
+
var _a;
|
|
58350
|
+
this.parentElement = this.$el.parentElement;
|
|
58351
|
+
if (this.instance.textResize) {
|
|
58352
|
+
this.$el.style.fontSize = `${this.instance.textResize.fontSize}px`;
|
|
58353
|
+
this.parentWidth = ((_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
|
|
58354
|
+
this.resizeObserver = new ResizeObserver(this.handleResize);
|
|
58355
|
+
this.resizeObserver.observe(this.parentElement);
|
|
58356
|
+
}
|
|
58357
|
+
}
|
|
58358
|
+
destroyed() {
|
|
58359
|
+
var _a;
|
|
58360
|
+
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
58249
58361
|
}
|
|
58250
58362
|
};
|
|
58251
58363
|
__decorate([
|
|
@@ -58260,6 +58372,10 @@ __decorate([
|
|
|
58260
58372
|
PropWatch({ type: String, default: 'p' }),
|
|
58261
58373
|
__metadata("design:type", String)
|
|
58262
58374
|
], ZdText.prototype, "tag", void 0);
|
|
58375
|
+
__decorate([
|
|
58376
|
+
PropWatch({ type: Object, default: undefined }),
|
|
58377
|
+
__metadata("design:type", Object)
|
|
58378
|
+
], ZdText.prototype, "textResize", void 0);
|
|
58263
58379
|
ZdText = __decorate([
|
|
58264
58380
|
Component$1({
|
|
58265
58381
|
components: { ZdRender },
|
|
@@ -59204,8 +59320,8 @@ var __vue_render__$5 = function () {
|
|
|
59204
59320
|
nudgeRight: _vm.instance.right ? _vm.instance.nudge : undefined,
|
|
59205
59321
|
nudgeTop: _vm.instance.top ? _vm.instance.nudge : undefined,
|
|
59206
59322
|
openOnClick: _vm.instance.openOnClick,
|
|
59207
|
-
openOnFocus: _vm.instance.openOnFocus,
|
|
59208
|
-
openOnHover: _vm.instance.openOnHover,
|
|
59323
|
+
openOnFocus: !_vm.$isMobile() && _vm.instance.openOnFocus,
|
|
59324
|
+
openOnHover: !_vm.$isMobile() && _vm.instance.openOnHover,
|
|
59209
59325
|
right: _vm.instance.right,
|
|
59210
59326
|
top: _vm.instance.top,
|
|
59211
59327
|
},
|
|
@@ -59220,7 +59336,7 @@ __vue_render__$5._withStripped = true;
|
|
|
59220
59336
|
/* style */
|
|
59221
59337
|
const __vue_inject_styles__$5 = function (inject) {
|
|
59222
59338
|
if (!inject) return
|
|
59223
|
-
inject("data-v-
|
|
59339
|
+
inject("data-v-219472aa_0", { source: ".v-tooltip__content {\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n}\n.v-tooltip__content.menuable__content__active {\n opacity: 0.9 !important;\n}", map: undefined, media: undefined });
|
|
59224
59340
|
|
|
59225
59341
|
};
|
|
59226
59342
|
/* scoped */
|
package/dist/zd-vuetify.umd.js
CHANGED
|
@@ -38193,8 +38193,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
38193
38193
|
constructor() {
|
|
38194
38194
|
super(...arguments);
|
|
38195
38195
|
this.instanceType = common.ApexChart;
|
|
38196
|
+
this.breakpoints = [];
|
|
38196
38197
|
}
|
|
38197
38198
|
mounted() {
|
|
38199
|
+
var _a, _b;
|
|
38198
38200
|
this.setApexChartTheme();
|
|
38199
38201
|
const updateFn = this.updateChart;
|
|
38200
38202
|
this.instance.setViewUpdate(updateFn);
|
|
@@ -38202,6 +38204,17 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
38202
38204
|
if (this.instance.fillHeight) {
|
|
38203
38205
|
setFillHeight(this.$el);
|
|
38204
38206
|
}
|
|
38207
|
+
this.defaultOptions = Object.assign({}, this.$refs.instance.chart.w.config);
|
|
38208
|
+
this.breakpoints = ((_b = (_a = this.instance.options) === null || _a === void 0 ? void 0 : _a.parentResponsive) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.breakpoint - b.breakpoint)) || [];
|
|
38209
|
+
this.apexChartContainer = this.$refs.chartContainer;
|
|
38210
|
+
if (this.breakpoints.length) {
|
|
38211
|
+
this.resizeObserver = new ResizeObserver(this.handleResize);
|
|
38212
|
+
this.resizeObserver.observe(this.apexChartContainer);
|
|
38213
|
+
}
|
|
38214
|
+
}
|
|
38215
|
+
beforeDestroy() {
|
|
38216
|
+
var _a;
|
|
38217
|
+
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
38205
38218
|
}
|
|
38206
38219
|
updateChart(options) {
|
|
38207
38220
|
return new Promise((resolve) => {
|
|
@@ -38225,6 +38238,17 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
38225
38238
|
} });
|
|
38226
38239
|
this.instance.options = newOptions;
|
|
38227
38240
|
}
|
|
38241
|
+
handleResize() {
|
|
38242
|
+
if (!this.breakpoints.length)
|
|
38243
|
+
return;
|
|
38244
|
+
const matchedOptions = this.breakpoints.find((bp) => this.apexChartContainer.clientWidth <= bp.breakpoint);
|
|
38245
|
+
if (matchedOptions) {
|
|
38246
|
+
this.instance.updateChart(matchedOptions.options);
|
|
38247
|
+
}
|
|
38248
|
+
else if (this.instance.options !== this.defaultOptions) {
|
|
38249
|
+
this.instance.updateChart(this.defaultOptions);
|
|
38250
|
+
}
|
|
38251
|
+
}
|
|
38228
38252
|
drillUp() {
|
|
38229
38253
|
this.instance.drillUp();
|
|
38230
38254
|
}
|
|
@@ -38297,6 +38321,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
38297
38321
|
return _c(
|
|
38298
38322
|
"div",
|
|
38299
38323
|
{
|
|
38324
|
+
ref: "chartContainer",
|
|
38300
38325
|
staticClass: "apexcharts-container",
|
|
38301
38326
|
style: {
|
|
38302
38327
|
height: _vm.$formatSize(_vm.instance.height),
|
|
@@ -38393,7 +38418,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
38393
38418
|
/* style */
|
|
38394
38419
|
const __vue_inject_styles__$1t = function (inject) {
|
|
38395
38420
|
if (!inject) return
|
|
38396
|
-
inject("data-v-
|
|
38421
|
+
inject("data-v-51426e9c_0", { source: ".zd-apex-chart.zd-apex-chart-drilled svg text.apexcharts-title-text {\n transform: translateX(20px);\n}\n.zd-apex-chart .apexcharts-toolbar {\n z-index: 0;\n}\n.zd-apex-chart .apexcharts-toolbar > div {\n transform: scale(0.8) !important;\n}\n.zd-apex-chart.theme--light .apexcharts-toolbar > div > .v-icon {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip {\n background: #fdfdfd !important;\n border: 1px solid #fdfdfd !important;\n color: #3b3b3b !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #eee !important;\n color: #3b3b3b !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--light .apexcharts-title-text {\n fill: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip {\n background: #eee !important;\n border: 1px solid #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-toolbar > div > .v-icon {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip {\n background: #1e1e1e !important;\n border: 1px solid #1e1e1e !important;\n color: #b8b8b8 !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #101010 !important;\n color: #b8b8b8 !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-title-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip {\n background: #101010 !important;\n border: 1px solid #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #252525 !important;\n}\n.apexcharts-overlay {\n z-index: 0 !important;\n}\n.apexcharts-container {\n position: relative;\n overflow: hidden !important;\n}\n.apexcharts-container .zd-apex-charts-drill-button {\n position: absolute;\n top: 0px;\n left: 0px;\n}", map: undefined, media: undefined });
|
|
38397
38422
|
|
|
38398
38423
|
};
|
|
38399
38424
|
/* scoped */
|
|
@@ -42559,13 +42584,14 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
42559
42584
|
this.instance.selectDate(date, event, this.$el);
|
|
42560
42585
|
}
|
|
42561
42586
|
getAllowedDates(date) {
|
|
42587
|
+
const parsedDate = this.instance.parseISODateValue(date);
|
|
42562
42588
|
if (typeof this.instance.allowedDates === 'function') {
|
|
42563
|
-
return this.instance.allowedDates(
|
|
42589
|
+
return this.instance.allowedDates(parsedDate);
|
|
42564
42590
|
}
|
|
42565
42591
|
if (typeof this.instance.allowedDates === 'undefined') {
|
|
42566
42592
|
return true;
|
|
42567
42593
|
}
|
|
42568
|
-
return this.instance.allowedDates.indexOf(
|
|
42594
|
+
return this.instance.allowedDates.indexOf(parsedDate) !== -1;
|
|
42569
42595
|
}
|
|
42570
42596
|
isPrintableKey(key) {
|
|
42571
42597
|
return !!key && key.length === 1;
|
|
@@ -42708,6 +42734,14 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
42708
42734
|
PropWatch({ type: String, default: '' }),
|
|
42709
42735
|
__metadata("design:type", String)
|
|
42710
42736
|
], ZdDate.prototype, "helperValue", void 0);
|
|
42737
|
+
__decorate([
|
|
42738
|
+
PropWatch({ type: String, default: '' }),
|
|
42739
|
+
__metadata("design:type", String)
|
|
42740
|
+
], ZdDate.prototype, "max", void 0);
|
|
42741
|
+
__decorate([
|
|
42742
|
+
PropWatch({ type: String, default: '' }),
|
|
42743
|
+
__metadata("design:type", String)
|
|
42744
|
+
], ZdDate.prototype, "min", void 0);
|
|
42711
42745
|
ZdDate = __decorate([
|
|
42712
42746
|
vuePropertyDecorator.Component
|
|
42713
42747
|
], ZdDate);
|
|
@@ -42843,6 +42877,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
42843
42877
|
showWeek: _vm.instance.showWeek,
|
|
42844
42878
|
type: _vm.instance.pickerType,
|
|
42845
42879
|
width: _vm.$isMobile() ? "290px" : _vm.instance.width,
|
|
42880
|
+
max: _vm.instance.formatISODateValue(_vm.instance.max),
|
|
42881
|
+
min: _vm.instance.formatISODateValue(_vm.instance.min),
|
|
42846
42882
|
},
|
|
42847
42883
|
false
|
|
42848
42884
|
),
|
|
@@ -42961,7 +42997,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
42961
42997
|
/* style */
|
|
42962
42998
|
const __vue_inject_styles__$1b = function (inject) {
|
|
42963
42999
|
if (!inject) return
|
|
42964
|
-
inject("data-v-
|
|
43000
|
+
inject("data-v-34d81b8c_0", { source: "div.v-picker--date .v-picker__body {\n background: transparent;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header {\n padding: var(--spacing-2) var(--spacing-4) var(--spacing-1) var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div button:not(:hover):not(:focus) {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-btn--icon {\n height: var(--icon-size);\n width: var(--icon-size);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value button {\n padding: 0;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table {\n margin-bottom: 12px;\n padding: 0 var(--spacing-4);\n height: 200px;\n margin-bottom: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table .v-btn.v-btn--active {\n color: var(--v-secondary-lighten4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--date .v-btn {\n width: 24px;\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month {\n padding-top: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month .v-btn {\n padding: 4px 0 7px 0;\n height: 24px;\n width: 56px;\n min-width: 56px;\n border-radius: var(--border);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month td {\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month tr:not(:last-child) td {\n padding-bottom: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table thead th {\n color: var(--zd-font-disabled-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent--text {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent {\n background: var(--zd-primary-base) !important;\n color: white !important;\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li.primary--text {\n color: var(--zd-primary-base) !important;\n}\n.zd-date-menu-activator .v-menu__activator.v-menu__activator--disabled {\n cursor: default;\n}\n.date-helper-values-button {\n height: 24px !important;\n margin-left: 5px;\n margin-top: 0;\n}\n.date-helper-values-button.with-label {\n margin-top: 20px;\n}\n.date-helper-values-option {\n cursor: pointer;\n}\n.date-helper-values-option:hover {\n background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
|
|
42965
43001
|
|
|
42966
43002
|
};
|
|
42967
43003
|
/* scoped */
|
|
@@ -43204,6 +43240,14 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
43204
43240
|
PropWatch({ type: [String, Array], default: () => [] }),
|
|
43205
43241
|
__metadata("design:type", Object)
|
|
43206
43242
|
], ZdDateRange.prototype, "value", void 0);
|
|
43243
|
+
__decorate([
|
|
43244
|
+
PropWatch({ type: String, default: '' }),
|
|
43245
|
+
__metadata("design:type", String)
|
|
43246
|
+
], ZdDateRange.prototype, "max", void 0);
|
|
43247
|
+
__decorate([
|
|
43248
|
+
PropWatch({ type: String, default: '' }),
|
|
43249
|
+
__metadata("design:type", String)
|
|
43250
|
+
], ZdDateRange.prototype, "min", void 0);
|
|
43207
43251
|
ZdDateRange = __decorate([
|
|
43208
43252
|
vuePropertyDecorator.Component
|
|
43209
43253
|
], ZdDateRange);
|
|
@@ -43345,6 +43389,12 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
43345
43389
|
showWeek: _vm.instance.showWeek,
|
|
43346
43390
|
type: _vm.instance.pickerType,
|
|
43347
43391
|
width: _vm.$isMobile() ? "290px" : _vm.instance.width,
|
|
43392
|
+
max: _vm.instance.formatISODateRangeValue(
|
|
43393
|
+
_vm.instance.max
|
|
43394
|
+
)[0],
|
|
43395
|
+
min: _vm.instance.formatISODateRangeValue(
|
|
43396
|
+
_vm.instance.min
|
|
43397
|
+
)[0],
|
|
43348
43398
|
},
|
|
43349
43399
|
false
|
|
43350
43400
|
),
|
|
@@ -43464,7 +43514,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
43464
43514
|
/* style */
|
|
43465
43515
|
const __vue_inject_styles__$1a = function (inject) {
|
|
43466
43516
|
if (!inject) return
|
|
43467
|
-
inject("data-v-
|
|
43517
|
+
inject("data-v-137a58b0_0", { source: "div.v-picker--date .v-picker__body {\n background: transparent;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header {\n padding: var(--spacing-2) var(--spacing-4) var(--spacing-1) var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value:not(.v-date-picker-header__value--disabled) > div button:not(:hover):not(:focus) {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-btn--icon {\n height: var(--icon-size);\n width: var(--icon-size);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-header .v-date-picker-header__value button {\n padding: 0;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table {\n margin-bottom: 12px;\n padding: 0 var(--spacing-4);\n height: 200px;\n margin-bottom: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table .v-btn.v-btn--active {\n color: var(--v-secondary-lighten4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--date .v-btn {\n width: 24px;\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month {\n padding-top: var(--spacing-4);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month .v-btn {\n padding: 4px 0 7px 0;\n height: 24px;\n width: 56px;\n min-width: 56px;\n border-radius: var(--border);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month td {\n height: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table.v-date-picker-table--month tr:not(:last-child) td {\n padding-bottom: 24px;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table thead th {\n color: var(--zd-font-disabled-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent--text {\n color: var(--zd-primary-base) !important;\n}\ndiv.v-picker--date .v-picker__body .v-date-picker-table table tbody button.v-btn.accent {\n background: var(--zd-primary-base) !important;\n color: white !important;\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li {\n color: var(--zd-font-default-color);\n}\ndiv.v-picker--date .v-picker__body ul.v-date-picker-years li.primary--text {\n color: var(--zd-primary-base) !important;\n}\n.zd-date-menu-activator .v-menu__activator.v-menu__activator--disabled {\n cursor: default;\n}\n.date-range-helper-values-button {\n height: 24px !important;\n margin-left: 5px;\n margin-top: 0;\n}\n.date-range-helper-values-button.with-label {\n margin-top: 20px;\n}\n.date-range-helper-values-option {\n cursor: pointer;\n}\n.date-range-helper-values-option:hover {\n background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
|
|
43468
43518
|
|
|
43469
43519
|
};
|
|
43470
43520
|
/* scoped */
|
|
@@ -53691,7 +53741,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53691
53741
|
const el = (Array.isArray(ref) ? ref[0].$el : ref === null || ref === void 0 ? void 0 : ref.$el);
|
|
53692
53742
|
return el || null;
|
|
53693
53743
|
}
|
|
53694
|
-
|
|
53744
|
+
registerDragEvents(modal) {
|
|
53695
53745
|
const el = this.getModalEl(modal);
|
|
53696
53746
|
if (!el)
|
|
53697
53747
|
return;
|
|
@@ -53704,11 +53754,28 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53704
53754
|
if (!this.dragHandle)
|
|
53705
53755
|
return;
|
|
53706
53756
|
this.dragHandle.addEventListener('mousedown', this.dragStart.bind(this, modal));
|
|
53757
|
+
this.dragHandle.addEventListener('touchstart', this.dragStart.bind(this, modal), { passive: false });
|
|
53707
53758
|
}
|
|
53708
|
-
|
|
53759
|
+
unregisterDragEvents(modal) {
|
|
53709
53760
|
if (!this.dragHandle)
|
|
53710
53761
|
return;
|
|
53711
53762
|
this.dragHandle.removeEventListener('mousedown', this.dragStart.bind(this, modal));
|
|
53763
|
+
this.dragHandle.removeEventListener('touchstart', this.dragStart.bind(this, modal));
|
|
53764
|
+
}
|
|
53765
|
+
isTouchEvent(event) {
|
|
53766
|
+
return 'touches' in event;
|
|
53767
|
+
}
|
|
53768
|
+
getEventCoordinates(event) {
|
|
53769
|
+
if (this.isTouchEvent(event)) {
|
|
53770
|
+
return {
|
|
53771
|
+
x: event.touches[0].clientX,
|
|
53772
|
+
y: event.touches[0].clientY,
|
|
53773
|
+
};
|
|
53774
|
+
}
|
|
53775
|
+
return {
|
|
53776
|
+
x: event.clientX,
|
|
53777
|
+
y: event.clientY,
|
|
53778
|
+
};
|
|
53712
53779
|
}
|
|
53713
53780
|
dragStart(modal, event) {
|
|
53714
53781
|
var _a, _b;
|
|
@@ -53716,26 +53783,35 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53716
53783
|
return;
|
|
53717
53784
|
const dragHandle = (_a = modal.dragHandle) === null || _a === void 0 ? void 0 : _a.replace('.', '');
|
|
53718
53785
|
const targetElement = event.target;
|
|
53719
|
-
const isDragHandleInvalid = dragHandle && !targetElement.
|
|
53786
|
+
const isDragHandleInvalid = dragHandle && !targetElement.classList.contains(dragHandle);
|
|
53720
53787
|
if (isDragHandleInvalid) {
|
|
53721
53788
|
return;
|
|
53722
53789
|
}
|
|
53723
53790
|
const isEventTargetInvalid = event && event.target && !((_b = event.target
|
|
53724
|
-
.parentElement) === null || _b === void 0 ? void 0 : _b.
|
|
53791
|
+
.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains(`zd-modal-card-${modal.name}`));
|
|
53725
53792
|
const isDragHandleMissing = !dragHandle;
|
|
53726
53793
|
if (isEventTargetInvalid && isDragHandleMissing) {
|
|
53727
53794
|
return;
|
|
53728
53795
|
}
|
|
53729
53796
|
this.modalDragged = modal;
|
|
53730
|
-
|
|
53731
|
-
this.
|
|
53732
|
-
|
|
53733
|
-
|
|
53797
|
+
const { x, y } = this.getEventCoordinates(event);
|
|
53798
|
+
this.x = x;
|
|
53799
|
+
this.y = y;
|
|
53800
|
+
if (this.isTouchEvent(event)) {
|
|
53801
|
+
document.addEventListener('touchmove', this.dragMove, { passive: false });
|
|
53802
|
+
document.addEventListener('touchend', this.dragEnd);
|
|
53803
|
+
}
|
|
53804
|
+
else {
|
|
53805
|
+
document.addEventListener('mousemove', this.dragMove);
|
|
53806
|
+
document.addEventListener('mouseup', this.dragEnd);
|
|
53807
|
+
}
|
|
53734
53808
|
}
|
|
53735
53809
|
dragEnd() {
|
|
53736
53810
|
this.modalDragged = undefined;
|
|
53737
53811
|
document.removeEventListener('mousemove', this.dragMove);
|
|
53738
53812
|
document.removeEventListener('mouseup', this.dragEnd);
|
|
53813
|
+
document.removeEventListener('touchmove', this.dragMove);
|
|
53814
|
+
document.removeEventListener('touchend', this.dragEnd);
|
|
53739
53815
|
}
|
|
53740
53816
|
dragMove(event) {
|
|
53741
53817
|
var _a;
|
|
@@ -53745,8 +53821,9 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53745
53821
|
if (!modalEl)
|
|
53746
53822
|
return;
|
|
53747
53823
|
event.preventDefault();
|
|
53748
|
-
const
|
|
53749
|
-
const
|
|
53824
|
+
const { x, y } = this.getEventCoordinates(event);
|
|
53825
|
+
const dy = y - this.y;
|
|
53826
|
+
const dx = x - this.x;
|
|
53750
53827
|
const toNum = (str) => Number(str.slice(0, -2));
|
|
53751
53828
|
const toPx = (num) => `${num}px`;
|
|
53752
53829
|
const threshold = 1;
|
|
@@ -53761,8 +53838,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53761
53838
|
&& (window.innerWidth / 2) - 2 * (left + dx) >= 0) {
|
|
53762
53839
|
modalEl.style.left = toPx(left + dx);
|
|
53763
53840
|
}
|
|
53764
|
-
this.x =
|
|
53765
|
-
this.y =
|
|
53841
|
+
this.x = x;
|
|
53842
|
+
this.y = y;
|
|
53766
53843
|
}
|
|
53767
53844
|
}
|
|
53768
53845
|
getContentClass(modal) {
|
|
@@ -53856,10 +53933,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53856
53933
|
style: modal.cssStyle,
|
|
53857
53934
|
on: {
|
|
53858
53935
|
"hook:mounted": function ($event) {
|
|
53859
|
-
modal.draggable && _vm.
|
|
53936
|
+
modal.draggable && _vm.registerDragEvents(modal);
|
|
53860
53937
|
},
|
|
53861
53938
|
"hook:destroyed": function ($event) {
|
|
53862
|
-
return _vm.
|
|
53939
|
+
return _vm.unregisterDragEvents(modal)
|
|
53863
53940
|
},
|
|
53864
53941
|
},
|
|
53865
53942
|
},
|
|
@@ -53923,7 +54000,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
53923
54000
|
/* style */
|
|
53924
54001
|
const __vue_inject_styles__$u = function (inject) {
|
|
53925
54002
|
if (!inject) return
|
|
53926
|
-
inject("data-v-
|
|
54003
|
+
inject("data-v-12867ee3_0", { source: ".zd-modal-title {\n padding-bottom: 0px;\n}\n.zd-modal-container {\n padding: 0;\n cursor: default;\n}\n.zd-modal-flex {\n width: 100%;\n}\n.zd-modal-draggable {\n position: relative;\n}\n.zd-modal-draggable-handle {\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab;\n}\n.zd-modal-draggable-handle:active {\n cursor: grabbing;\n cursor: -moz-grabbing;\n cursor: -webkit-grabbing;\n}\n.zd-modal-content > .zd-modal-card > .zd-modal-title {\n padding: var(--zd-default-padding);\n padding-bottom: 0px;\n font-size: var(--zd-font-title-size);\n font-weight: var(--zd-font-title-weight);\n color: var(--zd-font-color);\n}\n.zd-modal-content > .zd-modal-card > .zd-modal-card-text {\n padding: var(--zd-default-padding);\n display: flex;\n flex: 1 1 auto;\n}", map: undefined, media: undefined });
|
|
53927
54004
|
|
|
53928
54005
|
};
|
|
53929
54006
|
/* scoped */
|
|
@@ -57689,6 +57766,9 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
57689
57766
|
if (this.instance.fillHeight) {
|
|
57690
57767
|
setFillHeight(this.$el);
|
|
57691
57768
|
}
|
|
57769
|
+
core.I18n.registerChangeListener(() => {
|
|
57770
|
+
this.$refs.tabs.callSlider();
|
|
57771
|
+
});
|
|
57692
57772
|
}
|
|
57693
57773
|
};
|
|
57694
57774
|
__decorate([
|
|
@@ -57711,6 +57791,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
57711
57791
|
PropWatch({ type: [Boolean, String], default: false }),
|
|
57712
57792
|
__metadata("design:type", Object)
|
|
57713
57793
|
], ZdTabs.prototype, "fillHeight", void 0);
|
|
57794
|
+
__decorate([
|
|
57795
|
+
PropWatch({ type: [Boolean, String], default: false }),
|
|
57796
|
+
__metadata("design:type", Boolean)
|
|
57797
|
+
], ZdTabs.prototype, "touchless", void 0);
|
|
57714
57798
|
__decorate([
|
|
57715
57799
|
vuePropertyDecorator.Prop({ type: Array, default: () => [] }),
|
|
57716
57800
|
__metadata("design:type", Array)
|
|
@@ -57755,6 +57839,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
57755
57839
|
_c(
|
|
57756
57840
|
"v-tabs",
|
|
57757
57841
|
{
|
|
57842
|
+
ref: "tabs",
|
|
57758
57843
|
attrs: {
|
|
57759
57844
|
"show-arrows": "",
|
|
57760
57845
|
dark: _vm.instance.dark,
|
|
@@ -57817,7 +57902,11 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
57817
57902
|
_c(
|
|
57818
57903
|
"v-tabs-items",
|
|
57819
57904
|
{
|
|
57820
|
-
attrs: {
|
|
57905
|
+
attrs: {
|
|
57906
|
+
dark: _vm.instance.dark,
|
|
57907
|
+
light: _vm.instance.light,
|
|
57908
|
+
touchless: _vm.instance.touchless,
|
|
57909
|
+
},
|
|
57821
57910
|
model: {
|
|
57822
57911
|
value: _vm.instance.activeTab,
|
|
57823
57912
|
callback: function ($$v) {
|
|
@@ -57873,11 +57962,11 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
57873
57962
|
/* style */
|
|
57874
57963
|
const __vue_inject_styles__$c = function (inject) {
|
|
57875
57964
|
if (!inject) return
|
|
57876
|
-
inject("data-v-
|
|
57965
|
+
inject("data-v-f3ce5dca_0", { source: ".zd-tabs[data-v-f3ce5dca] {\n display: flex;\n flex-direction: column;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar,\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items {\n background-color: transparent;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar {\n height: auto;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar .v-tabs-slider-wrapper {\n bottom: -1px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-bar__content {\n border-bottom: solid 1px var(--v-grey-lighten4);\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs {\n margin-bottom: var(--spacing-4);\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__next,\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__prev {\n flex-basis: 30px;\n min-width: 30px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__next .v-icon,\n.zd-tabs[data-v-f3ce5dca] .v-tabs .v-slide-group__prev .v-icon {\n font-size: 18px;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs {\n flex-grow: 0;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items {\n flex-grow: 1;\n overflow-y: auto;\n}\n.zd-tabs[data-v-f3ce5dca] .v-tabs-items .v-window__container {\n height: 100% !important;\n}", map: undefined, media: undefined });
|
|
57877
57966
|
|
|
57878
57967
|
};
|
|
57879
57968
|
/* scoped */
|
|
57880
|
-
const __vue_scope_id__$c = "data-v-
|
|
57969
|
+
const __vue_scope_id__$c = "data-v-f3ce5dca";
|
|
57881
57970
|
/* module identifier */
|
|
57882
57971
|
const __vue_module_identifier__$c = undefined;
|
|
57883
57972
|
/* functional template */
|
|
@@ -58245,6 +58334,29 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
58245
58334
|
constructor() {
|
|
58246
58335
|
super(...arguments);
|
|
58247
58336
|
this.instanceType = common.Text;
|
|
58337
|
+
this.parentWidth = 0;
|
|
58338
|
+
}
|
|
58339
|
+
handleResize() {
|
|
58340
|
+
if (this.parentWidth && this.textResize.fontSize) {
|
|
58341
|
+
const proportion = this.parentElement.clientWidth / this.parentWidth;
|
|
58342
|
+
const MIN = this.textResize.min || 0;
|
|
58343
|
+
const MAX = this.textResize.max || Infinity;
|
|
58344
|
+
this.$el.style.fontSize = `${Math.min(Math.max(this.textResize.fontSize * proportion, MIN), MAX)}px`;
|
|
58345
|
+
}
|
|
58346
|
+
}
|
|
58347
|
+
mounted() {
|
|
58348
|
+
var _a;
|
|
58349
|
+
this.parentElement = this.$el.parentElement;
|
|
58350
|
+
if (this.instance.textResize) {
|
|
58351
|
+
this.$el.style.fontSize = `${this.instance.textResize.fontSize}px`;
|
|
58352
|
+
this.parentWidth = ((_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
|
|
58353
|
+
this.resizeObserver = new ResizeObserver(this.handleResize);
|
|
58354
|
+
this.resizeObserver.observe(this.parentElement);
|
|
58355
|
+
}
|
|
58356
|
+
}
|
|
58357
|
+
destroyed() {
|
|
58358
|
+
var _a;
|
|
58359
|
+
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
58248
58360
|
}
|
|
58249
58361
|
};
|
|
58250
58362
|
__decorate([
|
|
@@ -58259,6 +58371,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
58259
58371
|
PropWatch({ type: String, default: 'p' }),
|
|
58260
58372
|
__metadata("design:type", String)
|
|
58261
58373
|
], ZdText.prototype, "tag", void 0);
|
|
58374
|
+
__decorate([
|
|
58375
|
+
PropWatch({ type: Object, default: undefined }),
|
|
58376
|
+
__metadata("design:type", Object)
|
|
58377
|
+
], ZdText.prototype, "textResize", void 0);
|
|
58262
58378
|
ZdText = __decorate([
|
|
58263
58379
|
vuePropertyDecorator.Component({
|
|
58264
58380
|
components: { ZdRender: vue.ZdRender },
|
|
@@ -59203,8 +59319,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
59203
59319
|
nudgeRight: _vm.instance.right ? _vm.instance.nudge : undefined,
|
|
59204
59320
|
nudgeTop: _vm.instance.top ? _vm.instance.nudge : undefined,
|
|
59205
59321
|
openOnClick: _vm.instance.openOnClick,
|
|
59206
|
-
openOnFocus: _vm.instance.openOnFocus,
|
|
59207
|
-
openOnHover: _vm.instance.openOnHover,
|
|
59322
|
+
openOnFocus: !_vm.$isMobile() && _vm.instance.openOnFocus,
|
|
59323
|
+
openOnHover: !_vm.$isMobile() && _vm.instance.openOnHover,
|
|
59208
59324
|
right: _vm.instance.right,
|
|
59209
59325
|
top: _vm.instance.top,
|
|
59210
59326
|
},
|
|
@@ -59219,7 +59335,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
|
|
|
59219
59335
|
/* style */
|
|
59220
59336
|
const __vue_inject_styles__$5 = function (inject) {
|
|
59221
59337
|
if (!inject) return
|
|
59222
|
-
inject("data-v-
|
|
59338
|
+
inject("data-v-219472aa_0", { source: ".v-tooltip__content {\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n}\n.v-tooltip__content.menuable__content__active {\n opacity: 0.9 !important;\n}", map: undefined, media: undefined });
|
|
59223
59339
|
|
|
59224
59340
|
};
|
|
59225
59341
|
/* scoped */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zeedhi/vuetify",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.80.0",
|
|
4
4
|
"description": "Zeedhi Components based on Vuetify",
|
|
5
5
|
"author": "Zeedhi <zeedhi@teknisa.com>",
|
|
6
6
|
"license": "ISC",
|
|
@@ -51,5 +51,5 @@
|
|
|
51
51
|
"@types/prismjs": "1.26.*",
|
|
52
52
|
"@types/sortablejs": "1.15.*"
|
|
53
53
|
},
|
|
54
|
-
"gitHead": "
|
|
54
|
+
"gitHead": "c455fb4a9d59f5fa256a85da461067bfd84f3397"
|
|
55
55
|
}
|
|
@@ -19,8 +19,14 @@ export default class ZdApexChart extends ZdComponentRender {
|
|
|
19
19
|
loadColor?: string;
|
|
20
20
|
instance: ApexChart;
|
|
21
21
|
instanceType: typeof ApexChart;
|
|
22
|
+
private defaultOptions;
|
|
23
|
+
private breakpoints;
|
|
24
|
+
private apexChartContainer;
|
|
25
|
+
private resizeObserver?;
|
|
22
26
|
mounted(): void;
|
|
27
|
+
beforeDestroy(): void;
|
|
23
28
|
private updateChart;
|
|
24
29
|
setApexChartTheme(): void;
|
|
30
|
+
handleResize(): void;
|
|
25
31
|
drillUp(): void;
|
|
26
32
|
}
|
|
@@ -13,11 +13,13 @@ export default class ZdModal extends ZdComponent {
|
|
|
13
13
|
protected dragHandle: HTMLElement | null;
|
|
14
14
|
protected modalDragged?: Modal;
|
|
15
15
|
getModalEl(modal: Modal): HTMLElement | null;
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
registerDragEvents(modal: Modal): void;
|
|
17
|
+
unregisterDragEvents(modal: Modal): void;
|
|
18
|
+
private isTouchEvent;
|
|
19
|
+
private getEventCoordinates;
|
|
20
|
+
private dragStart;
|
|
21
|
+
private dragEnd;
|
|
22
|
+
private dragMove;
|
|
21
23
|
getContentClass(modal: Modal): string;
|
|
22
24
|
onKeyDown(event: KeyboardEvent, modal: Modal): void;
|
|
23
25
|
topModalFocus(): void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Text } from '@zeedhi/common';
|
|
1
|
+
import { Text, ITextResize } from '@zeedhi/common';
|
|
2
2
|
import ZdComponent from '../zd-component/ZdComponent';
|
|
3
3
|
/**
|
|
4
4
|
* Text component
|
|
@@ -7,6 +7,13 @@ export default class ZdText extends ZdComponent {
|
|
|
7
7
|
compile: boolean;
|
|
8
8
|
text: string | string[];
|
|
9
9
|
tag: string;
|
|
10
|
+
textResize: ITextResize;
|
|
10
11
|
instance: Text;
|
|
11
12
|
instanceType: typeof Text;
|
|
13
|
+
private parentWidth;
|
|
14
|
+
handleResize(): void;
|
|
15
|
+
parentElement?: HTMLElement;
|
|
16
|
+
resizeObserver: any;
|
|
17
|
+
mounted(): void;
|
|
18
|
+
destroyed(): void;
|
|
12
19
|
}
|