@schukai/monster 3.55.0 → 3.55.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/package.json +1 -1
- package/source/components/datatable/datasource/rest.mjs +313 -326
- package/source/components/datatable/datatable/header.mjs +1 -1
- package/source/components/datatable/datatable.mjs +586 -591
- package/source/components/datatable/embedded-pagination.mjs +42 -49
- package/source/components/datatable/filter/util.mjs +115 -99
- package/source/components/datatable/filter.mjs +901 -842
- package/source/components/datatable/pagination.mjs +333 -334
- package/source/components/datatable/status.mjs +134 -156
- package/source/components/datatable/stylesheet/column-bar.mjs +14 -8
- package/source/components/datatable/stylesheet/dataset.mjs +14 -8
- package/source/components/datatable/stylesheet/datasource.mjs +14 -8
- package/source/components/datatable/stylesheet/datatable.mjs +14 -8
- package/source/components/datatable/stylesheet/embedded-pagination.mjs +14 -8
- package/source/components/datatable/stylesheet/filter-button.mjs +14 -8
- package/source/components/datatable/stylesheet/filter-controls-defaults.mjs +14 -8
- package/source/components/datatable/stylesheet/filter-date-range.mjs +14 -8
- package/source/components/datatable/stylesheet/filter-range.mjs +14 -8
- package/source/components/datatable/stylesheet/filter.mjs +14 -8
- package/source/components/datatable/stylesheet/pagination.mjs +14 -8
- package/source/components/datatable/stylesheet/select-filter.mjs +14 -8
- package/source/components/datatable/stylesheet/status.mjs +14 -8
- package/source/components/form/action-button.mjs +3 -1
- package/source/components/form/confirm-button.mjs +3 -1
- package/source/components/form/context-error.mjs +161 -164
- package/source/components/form/context-help.mjs +3 -1
- package/source/components/form/form.mjs +3 -1
- package/source/components/form/message-state-button.mjs +3 -1
- package/source/components/form/popper-button.mjs +6 -4
- package/source/components/form/popper.mjs +310 -310
- package/source/components/form/select.mjs +2 -2
- package/source/components/form/state-button.mjs +3 -1
- package/source/components/form/stylesheet/action-button.mjs +14 -8
- package/source/components/form/stylesheet/api-button.mjs +14 -8
- package/source/components/form/stylesheet/button-bar.mjs +14 -8
- package/source/components/form/stylesheet/button.mjs +14 -8
- package/source/components/form/stylesheet/confirm-button.mjs +14 -8
- package/source/components/form/stylesheet/context-error.mjs +14 -8
- package/source/components/form/stylesheet/context-help.mjs +14 -8
- package/source/components/form/stylesheet/form.mjs +14 -8
- package/source/components/form/stylesheet/message-state-button.mjs +14 -8
- package/source/components/form/stylesheet/popper-button.mjs +14 -8
- package/source/components/form/stylesheet/popper.mjs +14 -8
- package/source/components/form/stylesheet/select.mjs +14 -8
- package/source/components/form/stylesheet/state-button.mjs +14 -8
- package/source/components/form/stylesheet/tabs.mjs +14 -8
- package/source/components/form/stylesheet/tree-select.mjs +14 -8
- package/source/components/form/tabs.mjs +754 -758
- package/source/components/host/collapse.mjs +2 -4
- package/source/components/host/config-manager.mjs +11 -9
- package/source/components/host/stylesheet/call-button.mjs +14 -8
- package/source/components/host/stylesheet/collapse.mjs +14 -8
- package/source/components/host/stylesheet/config-manager.mjs +14 -8
- package/source/components/host/stylesheet/details.mjs +14 -8
- package/source/components/host/stylesheet/host.mjs +14 -8
- package/source/components/host/stylesheet/overlay.mjs +14 -8
- package/source/components/host/stylesheet/toggle-button.mjs +14 -8
- package/source/components/host/stylesheet/viewer.mjs +14 -8
- package/source/components/host/util.mjs +2 -2
- package/source/components/notify/stylesheet/message.mjs +14 -8
- package/source/components/notify/stylesheet/notify.mjs +14 -8
- package/source/components/state/stylesheet/log.mjs +14 -8
- package/source/components/state/stylesheet/state.mjs +14 -8
- package/source/components/stylesheet/badge.mjs +14 -8
- package/source/components/stylesheet/border.mjs +14 -8
- package/source/components/stylesheet/button.mjs +14 -8
- package/source/components/stylesheet/card.mjs +14 -8
- package/source/components/stylesheet/color.mjs +14 -8
- package/source/components/stylesheet/common.mjs +14 -8
- package/source/components/stylesheet/control.mjs +14 -8
- package/source/components/stylesheet/data-grid.mjs +14 -8
- package/source/components/stylesheet/display.mjs +14 -8
- package/source/components/stylesheet/floating-ui.mjs +14 -8
- package/source/components/stylesheet/form.mjs +14 -8
- package/source/components/stylesheet/host.mjs +14 -8
- package/source/components/stylesheet/icons.mjs +14 -8
- package/source/components/stylesheet/link.mjs +14 -8
- package/source/components/stylesheet/normalize.mjs +14 -8
- package/source/components/stylesheet/popper.mjs +14 -8
- package/source/components/stylesheet/property.mjs +14 -8
- package/source/components/stylesheet/ripple.mjs +14 -8
- package/source/components/stylesheet/skeleton.mjs +14 -8
- package/source/components/stylesheet/space.mjs +14 -8
- package/source/components/stylesheet/spinner.mjs +14 -8
- package/source/components/stylesheet/table.mjs +14 -8
- package/source/components/stylesheet/theme.mjs +14 -8
- package/source/components/stylesheet/typography.mjs +14 -8
- package/source/components/tree-menu/stylesheet/tree-menu.mjs +14 -8
- package/source/data/transformer.mjs +6 -8
- package/source/dom/attributes.mjs +5 -5
- package/source/dom/customelement.mjs +1 -1
- package/source/dom/updater.mjs +697 -700
- package/source/dom/util.mjs +2 -2
- package/source/monster.mjs +0 -1
- package/source/types/noderecursiveiterator.mjs +9 -7
- package/source/types/version.mjs +1 -1
- package/source/util/sleep.mjs +3 -4
- package/test/cases/monster.mjs +1 -1
@@ -4,18 +4,21 @@
|
|
4
4
|
* This file is licensed under the AGPLv3 License.
|
5
5
|
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
|
6
6
|
*/
|
7
|
-
import {instanceSymbol} from "../../constants.mjs";
|
8
|
-
import {assembleMethodSymbol, registerCustomElement} from "../../dom/customelement.mjs";
|
9
|
-
import {CustomControl} from "../../dom/customcontrol.mjs";
|
10
|
-
import {ContextErrorStyleSheet} from "./stylesheet/context-error.mjs";
|
11
|
-
import {ThemeStyleSheet} from "../stylesheet/theme.mjs";
|
12
|
-
import {Popper} from "./popper.mjs";
|
7
|
+
import { instanceSymbol } from "../../constants.mjs";
|
13
8
|
import {
|
14
|
-
|
15
|
-
|
9
|
+
assembleMethodSymbol,
|
10
|
+
registerCustomElement,
|
11
|
+
} from "../../dom/customelement.mjs";
|
12
|
+
import { CustomControl } from "../../dom/customcontrol.mjs";
|
13
|
+
import { ContextErrorStyleSheet } from "./stylesheet/context-error.mjs";
|
14
|
+
import { ThemeStyleSheet } from "../stylesheet/theme.mjs";
|
15
|
+
import { Popper } from "./popper.mjs";
|
16
|
+
import {
|
17
|
+
ATTRIBUTE_ERRORMESSAGE,
|
18
|
+
ATTRIBUTE_ROLE,
|
16
19
|
} from "../../dom/constants.mjs";
|
17
20
|
|
18
|
-
export {ContextError};
|
21
|
+
export { ContextError };
|
19
22
|
|
20
23
|
/**
|
21
24
|
* @private
|
@@ -80,147 +83,141 @@ const iconElementSymbol = Symbol("iconElement");
|
|
80
83
|
* @summary A control that can be used to display a tooltip or a popover with an error message.
|
81
84
|
*/
|
82
85
|
class ContextError extends Popper {
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
/**
|
219
|
-
* @return {Array<CSSStyleSheet>}
|
220
|
-
*/
|
221
|
-
static getCSSStyleSheet() {
|
222
|
-
return [ContextErrorStyleSheet, ThemeStyleSheet];
|
223
|
-
}
|
86
|
+
/**
|
87
|
+
* This method is called by the `instanceof` operator.
|
88
|
+
* @returns {symbol}
|
89
|
+
* @since 2.1.0
|
90
|
+
*/
|
91
|
+
static get [instanceSymbol]() {
|
92
|
+
return Symbol.for(
|
93
|
+
"@schukai/monster/components/form/context-error@@instance",
|
94
|
+
);
|
95
|
+
}
|
96
|
+
|
97
|
+
/**
|
98
|
+
*
|
99
|
+
* @return {Monster.Components.Form.PopperButton}
|
100
|
+
*/
|
101
|
+
[assembleMethodSymbol]() {
|
102
|
+
super[assembleMethodSymbol]();
|
103
|
+
initControlReferences.call(this);
|
104
|
+
|
105
|
+
if (this.hasErrorMessage()) {
|
106
|
+
this[iconElementSymbol].classList.remove("hidden");
|
107
|
+
}
|
108
|
+
}
|
109
|
+
|
110
|
+
/**
|
111
|
+
* To set the options via the html tag the attribute `data-monster-options` must be used.
|
112
|
+
* @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
|
113
|
+
*
|
114
|
+
* The individual configuration values can be found in the table.
|
115
|
+
*
|
116
|
+
* @property {Object} templates - The templates for the control.
|
117
|
+
* @property {string} templates.main - The main template.
|
118
|
+
* @property {string} mode - The mode of the popper. Possible values are `click`, `enter` and `hover`.
|
119
|
+
* @property {string} content - The content of the popper.
|
120
|
+
* @property {object} popper - The popper options.
|
121
|
+
* @property {string} popper.placement - The placement of the popper. Possible values are `top`, `bottom`, `left`, `right`, `auto`, `auto-start`, `auto-end`, `top-start`, `top-end`, `bottom-start`, `bottom-end`, `right-start`, `right-end`, `left-start`, `left-end`.
|
122
|
+
* @extends {CustomControl}
|
123
|
+
*/
|
124
|
+
get defaults() {
|
125
|
+
return Object.assign({}, super.defaults, {
|
126
|
+
templates: {
|
127
|
+
main: getTemplate(),
|
128
|
+
},
|
129
|
+
mode: "auto",
|
130
|
+
|
131
|
+
content: "",
|
132
|
+
|
133
|
+
classes: {
|
134
|
+
button: "monster-theme-error-2",
|
135
|
+
},
|
136
|
+
});
|
137
|
+
}
|
138
|
+
|
139
|
+
/**
|
140
|
+
*
|
141
|
+
* @return {Monster.Components.Form.Popper}
|
142
|
+
*/
|
143
|
+
showDialog() {
|
144
|
+
if (!this.hasErrorMessage()) {
|
145
|
+
return this;
|
146
|
+
}
|
147
|
+
|
148
|
+
super.showDialog();
|
149
|
+
return this;
|
150
|
+
}
|
151
|
+
|
152
|
+
/**
|
153
|
+
*
|
154
|
+
* @return {Monster.Components.Form.Popper}
|
155
|
+
*/
|
156
|
+
hideDialog() {
|
157
|
+
super.hideDialog();
|
158
|
+
return this;
|
159
|
+
}
|
160
|
+
|
161
|
+
/**
|
162
|
+
*
|
163
|
+
* @param message
|
164
|
+
* @param show {boolean|number} - If true the dialog is shown immediately. If false the dialog is hidden by default. If a number is specified the dialog is shown for the specified time in milliseconds.
|
165
|
+
* @returns {Monster.Components.Form.ContextError}
|
166
|
+
*/
|
167
|
+
setErrorMessage(message, show = false) {
|
168
|
+
message = message.trim();
|
169
|
+
|
170
|
+
if (message === "") {
|
171
|
+
return this.resetErrorMessage();
|
172
|
+
}
|
173
|
+
|
174
|
+
this.setOption("content", message);
|
175
|
+
this[iconElementSymbol].classList.remove("hidden");
|
176
|
+
|
177
|
+
if (show === true || show === 1 || show === "true") {
|
178
|
+
this.showDialog();
|
179
|
+
return this;
|
180
|
+
}
|
181
|
+
|
182
|
+
if (show === false || show === 0 || show === "false") {
|
183
|
+
return this;
|
184
|
+
}
|
185
|
+
|
186
|
+
try {
|
187
|
+
const interval = parseInt(show);
|
188
|
+
this.showDialog();
|
189
|
+
setTimeout(() => {
|
190
|
+
this.hideDialog();
|
191
|
+
}, interval);
|
192
|
+
} catch (e) {}
|
193
|
+
|
194
|
+
return this;
|
195
|
+
}
|
196
|
+
|
197
|
+
resetErrorMessage() {
|
198
|
+
this.hideDialog();
|
199
|
+
this.setOption("content", "");
|
200
|
+
this[iconElementSymbol].classList.add("hidden");
|
201
|
+
return this;
|
202
|
+
}
|
203
|
+
|
204
|
+
hasErrorMessage() {
|
205
|
+
return this.getOption("content", "") !== "";
|
206
|
+
}
|
207
|
+
|
208
|
+
/**
|
209
|
+
* @return {string}
|
210
|
+
*/
|
211
|
+
static getTag() {
|
212
|
+
return "monster-context-error";
|
213
|
+
}
|
214
|
+
|
215
|
+
/**
|
216
|
+
* @return {Array<CSSStyleSheet>}
|
217
|
+
*/
|
218
|
+
static getCSSStyleSheet() {
|
219
|
+
return [ContextErrorStyleSheet, ThemeStyleSheet];
|
220
|
+
}
|
224
221
|
}
|
225
222
|
|
226
223
|
/**
|
@@ -228,18 +225,18 @@ class ContextError extends Popper {
|
|
228
225
|
* @return {Select}
|
229
226
|
*/
|
230
227
|
function initControlReferences() {
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
228
|
+
this[controlElementSymbol] = this.shadowRoot.querySelector(
|
229
|
+
`[${ATTRIBUTE_ROLE}=control]`,
|
230
|
+
);
|
231
|
+
this[buttonElementSymbol] = this.shadowRoot.querySelector(
|
232
|
+
`[${ATTRIBUTE_ROLE}=button]`,
|
233
|
+
);
|
234
|
+
this[popperElementSymbol] = this.shadowRoot.querySelector(
|
235
|
+
`[${ATTRIBUTE_ROLE}=popper]`,
|
236
|
+
);
|
237
|
+
this[iconElementSymbol] = this.shadowRoot.querySelector(
|
238
|
+
"[data-monster-role=button] svg",
|
239
|
+
);
|
243
240
|
}
|
244
241
|
|
245
242
|
/**
|
@@ -247,8 +244,8 @@ function initControlReferences() {
|
|
247
244
|
* @return {string}
|
248
245
|
*/
|
249
246
|
function getTemplate() {
|
250
|
-
|
251
|
-
|
247
|
+
// language=HTML
|
248
|
+
return `
|
252
249
|
<div data-monster-role="control" part="control">
|
253
250
|
|
254
251
|
<div data-monster-role="button"
|
@@ -55,7 +55,9 @@ class ContextHelp extends Popper {
|
|
55
55
|
* @since 2.1.0
|
56
56
|
*/
|
57
57
|
static get [instanceSymbol]() {
|
58
|
-
return Symbol.for(
|
58
|
+
return Symbol.for(
|
59
|
+
"@schukai/monster/components/form/context-help@@instance",
|
60
|
+
);
|
59
61
|
}
|
60
62
|
|
61
63
|
/**
|
@@ -56,7 +56,9 @@ const ATTRIBUTE_FORM_DATASOURCE_ACTION = `${ATTRIBUTE_PREFIX}datasource-action`;
|
|
56
56
|
* @type {symbol}
|
57
57
|
* @since 1.7.0
|
58
58
|
*/
|
59
|
-
const formDataSymbol = Symbol.for(
|
59
|
+
const formDataSymbol = Symbol.for(
|
60
|
+
"@schukai/monster/components/form/form@@formdata",
|
61
|
+
);
|
60
62
|
|
61
63
|
/**
|
62
64
|
* @private
|
@@ -68,7 +68,9 @@ class MessageStateButton extends Popper {
|
|
68
68
|
* @since 2.1.0
|
69
69
|
*/
|
70
70
|
static get [instanceSymbol]() {
|
71
|
-
return Symbol.for(
|
71
|
+
return Symbol.for(
|
72
|
+
"@schukai/monster/components/form/message-state-button@@instance",
|
73
|
+
);
|
72
74
|
}
|
73
75
|
|
74
76
|
/**
|
@@ -125,7 +125,9 @@ class PopperButton extends Popper {
|
|
125
125
|
* @since 2.1.0
|
126
126
|
*/
|
127
127
|
static get [instanceSymbol]() {
|
128
|
-
return Symbol.for(
|
128
|
+
return Symbol.for(
|
129
|
+
"@schukai/monster/components/form/popper-button@@instance",
|
130
|
+
);
|
129
131
|
}
|
130
132
|
|
131
133
|
/**
|
@@ -395,15 +397,15 @@ function initControlReferences() {
|
|
395
397
|
this[controlElementSymbol] = this.shadowRoot.querySelector(
|
396
398
|
`[${ATTRIBUTE_ROLE}=control]`,
|
397
399
|
);
|
398
|
-
|
400
|
+
|
399
401
|
this[buttonElementSymbol] = this.shadowRoot.querySelector(
|
400
402
|
`[${ATTRIBUTE_ROLE}=button]`,
|
401
403
|
);
|
402
|
-
|
404
|
+
|
403
405
|
this[popperElementSymbol] = this.shadowRoot.querySelector(
|
404
406
|
`[${ATTRIBUTE_ROLE}=popper]`,
|
405
407
|
);
|
406
|
-
|
408
|
+
|
407
409
|
this[arrowElementSymbol] = this.shadowRoot.querySelector(
|
408
410
|
`[${ATTRIBUTE_ROLE}=arrow]`,
|
409
411
|
);
|