@schukai/monster 3.85.1 → 3.85.2

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,17 @@
2
2
 
3
3
 
4
4
 
5
+ ## [3.85.2] - 2024-11-12
6
+
7
+ ### Bug Fixes
8
+
9
+ - update some issues and documentaion [#260](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/260)
10
+ ### Changes
11
+
12
+ - code tidy
13
+
14
+
15
+
5
16
  ## [3.85.1] - 2024-11-12
6
17
 
7
18
  ### Bug Fixes
package/package.json CHANGED
@@ -1 +1 @@
1
- {"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.6.12","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"3.85.1"}
1
+ {"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.6.12","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"3.85.2"}
@@ -21,14 +21,12 @@ import {
21
21
  ATTRIBUTE_ERRORMESSAGE,
22
22
  ATTRIBUTE_ROLE,
23
23
  } from "../../dom/constants.mjs";
24
- import {CustomElement, getSlottedElements} from "../../dom/customelement.mjs";
24
+ import {CustomElement} from "../../dom/customelement.mjs";
25
25
  import {
26
26
  assembleMethodSymbol,
27
27
  registerCustomElement,
28
28
  } from "../../dom/customelement.mjs";
29
29
  import {getDocument} from "../../dom/util.mjs";
30
- import {isString} from "../../types/is.mjs";
31
- import {validateString} from "../../types/validate.mjs";
32
30
  import {STYLE_DISPLAY_MODE_BLOCK} from "../form/constants.mjs";
33
31
  import {CopyStyleSheet} from "./stylesheet/copy.mjs";
34
32
  import {fireCustomEvent} from "../../dom/events.mjs";
@@ -55,43 +55,17 @@ const dotsContainerElementSymbol = Symbol("dotsContainerElement");
55
55
  */
56
56
  const popperInstanceSymbol = Symbol("popperInstance");
57
57
 
58
+
58
59
  /**
59
- * The ColumnBar component is used to show and configure the columns of a datatable.
60
- *
61
- * <img src="./images/column-bar.png">
62
- *
63
- * You can create this control either by specifying the HTML tag <monster-column-bar />` directly in the HTML or using
64
- * Javascript via the `document.createElement('monster-column-bar');` method.
65
- *
66
- * ```html
67
- * <monster-column-bar></monster-column-bar>
68
- * ```
60
+ * A column bar for a datatable
69
61
  *
70
- * Or you can create this CustomControl directly in Javascript:
62
+ * @fragments /fragments/components/datatable/datatable/
71
63
  *
72
- * ```js
73
- * import '@schukai/monster/components/datatable/column-bar.mjs';
74
- * document.createElement('monster-column-bar');
75
- * ```
76
- *
77
- * The Body should have a class "hidden" to ensure that the styles are applied correctly.
78
- *
79
- * ```css
80
- * body.hidden {
81
- * visibility: hidden;
82
- * }
83
- * ```
84
- *
85
- * @startuml column-bar.png
86
- * skinparam monochrome true
87
- * skinparam shadowing false
88
- * HTMLElement <|-- CustomElement
89
- * CustomElement <|-- ColumnBar
90
- * @enduml
64
+ * @example /examples/components/datatable/empty
91
65
  *
92
66
  * @copyright schukai GmbH
93
- * @summary A data set
94
- */
67
+ * @summary The ColumnBar component is used to show and configure the columns of a datatable.
68
+ **/
95
69
  class ColumnBar extends CustomElement {
96
70
  /**
97
71
  * This method is called by the `instanceof` operator.
@@ -137,7 +111,7 @@ class ColumnBar extends CustomElement {
137
111
 
138
112
  /**
139
113
  *
140
- * @return {Monster.Components.Form.Form}
114
+ * @return {void}
141
115
  */
142
116
  [assembleMethodSymbol]() {
143
117
  super[assembleMethodSymbol]();
@@ -147,7 +121,7 @@ class ColumnBar extends CustomElement {
147
121
  }
148
122
 
149
123
  /**
150
- * @return {Array<ColumnBarStyleSheet>}
124
+ * @return {CSSStyleSheet[]}
151
125
  */
152
126
  static getCSSStyleSheet() {
153
127
  return [ColumnBarStyleSheet];
@@ -156,7 +130,7 @@ class ColumnBar extends CustomElement {
156
130
 
157
131
  /**
158
132
  * @private
159
- * @return {Monster.Components.Datatable.Form}
133
+ * @return {ColumnBar}
160
134
  */
161
135
  function initControlReferences() {
162
136
  if (!this.shadowRoot) {
@@ -166,12 +140,15 @@ function initControlReferences() {
166
140
  this[settingsButtonElementSymbol] = this.shadowRoot.querySelector(
167
141
  "[data-monster-role=settings-button]",
168
142
  );
143
+
169
144
  this[settingsLayerElementSymbol] = this.shadowRoot.querySelector(
170
145
  "[data-monster-role=settings-layer]",
171
146
  );
147
+
172
148
  this[dotsContainerElementSymbol] = this.shadowRoot.querySelector(
173
149
  "[data-monster-role=dots]",
174
150
  );
151
+
175
152
  return this;
176
153
  }
177
154
 
@@ -199,6 +176,7 @@ function initEventHandler() {
199
176
  );
200
177
 
201
178
  self[dotsContainerElementSymbol].addEventListener("click", function (event) {
179
+
202
180
  const element = findTargetElementFromEvent(
203
181
  event,
204
182
  "data-monster-role",
@@ -220,6 +198,7 @@ function initEventHandler() {
220
198
  });
221
199
 
222
200
  self[settingsButtonEventHandlerSymbol] = (event) => {
201
+
223
202
  const clickTarget = event.composedPath()?.[0];
224
203
  if (
225
204
  self[settingsLayerElementSymbol] === clickTarget ||
@@ -227,7 +206,7 @@ function initEventHandler() {
227
206
  ) {
228
207
  return;
229
208
  }
230
- self[settingsLayerElementSymbol].classList.remove("visible");
209
+
231
210
  document.body.removeEventListener(
232
211
  "click",
233
212
  self[settingsButtonEventHandlerSymbol],
@@ -143,6 +143,7 @@ function initEventHandler() {
143
143
  function updateDataSource() {
144
144
  let data = null;
145
145
  getSlottedElements.call(this).forEach((element) => {
146
+
146
147
  if (!(element instanceof HTMLScriptElement)) {
147
148
  return;
148
149
  }