@schukai/monster 3.51.5 → 3.52.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.
Files changed (361) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/README.md +15 -12
  3. package/example/components/form/button.mjs +10 -0
  4. package/example/components/form/select.mjs +25 -0
  5. package/example/components/form/tree-select.mjs +27 -0
  6. package/example/components/host/host.mjs +0 -0
  7. package/example/components/notify/message.mjs +4 -0
  8. package/example/components/notify/notify.mjs +4 -0
  9. package/example/components/state/log.mjs +0 -0
  10. package/example/components/state/state.mjs +0 -0
  11. package/example/data/datasource/server/restapi.mjs +7 -1
  12. package/package.json +6 -2
  13. package/source/components/constants.mjs +132 -0
  14. package/source/components/datatable/columnbar.mjs +310 -0
  15. package/source/components/datatable/constants.mjs +121 -0
  16. package/source/components/datatable/dataset.mjs +219 -0
  17. package/source/components/datatable/datasource/dom.mjs +186 -0
  18. package/source/components/datatable/datasource/namespace.mjs +13 -0
  19. package/source/components/datatable/datasource/rest.mjs +400 -0
  20. package/source/components/datatable/datasource.mjs +102 -0
  21. package/source/components/datatable/datatable/header.mjs +268 -0
  22. package/source/components/datatable/datatable/namespace.mjs +13 -0
  23. package/source/components/datatable/datatable.mjs +789 -0
  24. package/source/components/datatable/embedded-pagination.mjs +113 -0
  25. package/source/components/datatable/filter/abstract-base.mjs +31 -0
  26. package/source/components/datatable/filter/date-range.mjs +1041 -0
  27. package/source/components/datatable/filter/input.mjs +175 -0
  28. package/source/components/datatable/filter/namespace.mjs +13 -0
  29. package/source/components/datatable/filter/range.mjs +671 -0
  30. package/source/components/datatable/filter/select.mjs +65 -0
  31. package/source/components/datatable/filter/settings.mjs +116 -0
  32. package/source/components/datatable/filter-button.mjs +98 -0
  33. package/source/components/datatable/filter.mjs +929 -0
  34. package/source/components/datatable/namespace.mjs +11 -0
  35. package/source/components/datatable/pagination.mjs +456 -0
  36. package/source/components/datatable/style/column-bar.pcss +123 -0
  37. package/source/components/datatable/style/dataset.pcss +13 -0
  38. package/source/components/datatable/style/datasource.pcss +16 -0
  39. package/source/components/datatable/style/datatable.pcss +239 -0
  40. package/source/components/datatable/style/embedded-pagination.pcss +101 -0
  41. package/source/components/datatable/style/filter-button.pcss +22 -0
  42. package/source/components/datatable/style/filter-controls-defaults.pcss +46 -0
  43. package/source/components/datatable/style/filter-date-range.pcss +9 -0
  44. package/source/components/datatable/style/filter-range.pcss +5 -0
  45. package/source/components/datatable/style/filter.pcss +156 -0
  46. package/source/components/datatable/style/pagination.pcss +59 -0
  47. package/source/components/datatable/style/select-filter.pcss +27 -0
  48. package/source/components/datatable/stylesheet/column-bar.mjs +27 -0
  49. package/source/components/datatable/stylesheet/dataset.mjs +27 -0
  50. package/source/components/datatable/stylesheet/datasource.mjs +27 -0
  51. package/source/components/datatable/stylesheet/datatable.mjs +27 -0
  52. package/source/components/datatable/stylesheet/embedded-pagination.mjs +27 -0
  53. package/source/components/datatable/stylesheet/filter-button.mjs +27 -0
  54. package/source/components/datatable/stylesheet/filter-controls-defaults.mjs +27 -0
  55. package/source/components/datatable/stylesheet/filter-date-range.mjs +27 -0
  56. package/source/components/datatable/stylesheet/filter-range.mjs +27 -0
  57. package/source/components/datatable/stylesheet/filter.mjs +27 -0
  58. package/source/components/datatable/stylesheet/namespace.mjs +13 -0
  59. package/source/components/datatable/stylesheet/pagination.mjs +27 -0
  60. package/source/components/datatable/stylesheet/select-filter.mjs +27 -0
  61. package/source/components/datatable/util.mjs +60 -0
  62. package/source/components/form/action-button.mjs +262 -0
  63. package/source/components/form/api-button.mjs +515 -0
  64. package/source/components/form/button-bar.mjs +739 -0
  65. package/source/components/form/button.mjs +350 -0
  66. package/source/components/form/confirm-button.mjs +330 -0
  67. package/source/components/form/constants.mjs +111 -0
  68. package/source/components/form/context-help.mjs +123 -0
  69. package/source/components/form/events.mjs +84 -0
  70. package/source/components/form/form.mjs +601 -0
  71. package/source/components/form/message-state-button.mjs +396 -0
  72. package/source/components/form/namespace.mjs +13 -0
  73. package/source/components/form/popper-button.mjs +435 -0
  74. package/source/components/form/popper.mjs +487 -0
  75. package/source/components/form/reload.mjs +360 -0
  76. package/source/components/form/select.mjs +2314 -0
  77. package/source/components/form/shadow-reload.mjs +137 -0
  78. package/source/components/form/state-button.mjs +182 -0
  79. package/source/components/form/style/action-button.pcss +41 -0
  80. package/source/components/form/style/api-button.pcss +0 -0
  81. package/source/components/form/style/button-bar.pcss +51 -0
  82. package/source/components/form/style/button.pcss +8 -0
  83. package/source/components/form/style/confirm-button.pcss +17 -0
  84. package/source/components/form/style/context-help.pcss +16 -0
  85. package/source/components/form/style/form.pcss +10 -0
  86. package/source/components/form/style/message-state-button.pcss +10 -0
  87. package/source/components/form/style/popper-button.pcss +16 -0
  88. package/source/components/form/style/popper.pcss +8 -0
  89. package/source/components/form/style/select.pcss +265 -0
  90. package/source/components/form/style/state-button.pcss +116 -0
  91. package/source/components/form/style/tabs.pcss +173 -0
  92. package/source/components/form/style/tree-select.pcss +81 -0
  93. package/source/components/form/stylesheet/action-button.mjs +27 -0
  94. package/source/components/form/stylesheet/api-button.mjs +27 -0
  95. package/source/components/form/stylesheet/button-bar.mjs +27 -0
  96. package/source/components/form/stylesheet/button.mjs +27 -0
  97. package/source/components/form/stylesheet/confirm-button.mjs +27 -0
  98. package/source/components/form/stylesheet/context-help.mjs +27 -0
  99. package/source/components/form/stylesheet/form.mjs +27 -0
  100. package/source/components/form/stylesheet/message-state-button.mjs +27 -0
  101. package/source/components/form/stylesheet/namespace.mjs +13 -0
  102. package/source/components/form/stylesheet/popper-button.mjs +27 -0
  103. package/source/components/form/stylesheet/popper.mjs +27 -0
  104. package/source/components/form/stylesheet/select.mjs +27 -0
  105. package/source/components/form/stylesheet/state-button.mjs +27 -0
  106. package/source/components/form/stylesheet/tabs.mjs +27 -0
  107. package/source/components/form/stylesheet/tree-select.mjs +27 -0
  108. package/source/components/form/tabs.mjs +1029 -0
  109. package/source/components/form/template.mjs +373 -0
  110. package/source/components/form/tree-select.mjs +527 -0
  111. package/source/components/form/types/namespace.mjs +13 -0
  112. package/source/components/form/types/state.mjs +93 -0
  113. package/source/components/form/util/fetch.mjs +133 -0
  114. package/source/components/form/util/floating-ui.mjs +245 -0
  115. package/source/components/form/util/namespace.mjs +13 -0
  116. package/source/components/form/util/popper.mjs +49 -0
  117. package/source/components/host/call-button.mjs +236 -0
  118. package/source/components/host/collapse.mjs +526 -0
  119. package/source/components/host/config-manager.mjs +304 -0
  120. package/source/components/host/constants.mjs +18 -0
  121. package/source/components/host/details.mjs +268 -0
  122. package/source/components/host/events.mjs +131 -0
  123. package/source/components/host/host.mjs +420 -0
  124. package/source/components/host/namespace.mjs +13 -0
  125. package/source/components/host/overlay.mjs +339 -0
  126. package/source/components/host/style/call-button.pcss +36 -0
  127. package/source/components/host/style/collapse.pcss +67 -0
  128. package/source/components/host/style/config-manager.pcss +5 -0
  129. package/source/components/host/style/details.pcss +68 -0
  130. package/source/components/host/style/host.pcss +43 -0
  131. package/source/components/host/style/overlay.pcss +73 -0
  132. package/source/components/host/style/toggle-button.pcss +36 -0
  133. package/source/components/host/style/viewer.pcss +13 -0
  134. package/source/components/host/stylesheet/call-button.mjs +27 -0
  135. package/source/components/host/stylesheet/collapse.mjs +27 -0
  136. package/source/components/host/stylesheet/config-manager.mjs +27 -0
  137. package/source/components/host/stylesheet/details.mjs +27 -0
  138. package/source/components/host/stylesheet/host.mjs +27 -0
  139. package/source/components/host/stylesheet/namespace.mjs +13 -0
  140. package/source/components/host/stylesheet/overlay.mjs +27 -0
  141. package/source/components/host/stylesheet/toggle-button.mjs +27 -0
  142. package/source/components/host/stylesheet/viewer.mjs +27 -0
  143. package/source/components/host/toggle-button.mjs +88 -0
  144. package/source/components/host/util.mjs +23 -0
  145. package/source/components/host/viewer.mjs +309 -0
  146. package/source/components/namespace.mjs +14 -0
  147. package/source/components/notify/constants.mjs +15 -0
  148. package/source/components/notify/events.mjs +15 -0
  149. package/source/components/notify/message.mjs +374 -0
  150. package/source/components/notify/namespace.mjs +15 -0
  151. package/source/components/notify/notify.mjs +236 -0
  152. package/source/components/notify/style/message.pcss +57 -0
  153. package/source/components/notify/style/notify.pcss +118 -0
  154. package/source/components/notify/stylesheet/message.mjs +27 -0
  155. package/source/components/notify/stylesheet/namespace.mjs +15 -0
  156. package/source/components/notify/stylesheet/notify.mjs +27 -0
  157. package/source/components/state/log/entry.mjs +126 -0
  158. package/source/components/state/log/namespace.mjs +13 -0
  159. package/source/components/state/log.mjs +275 -0
  160. package/source/components/state/namespace.mjs +13 -0
  161. package/source/components/state/state.mjs +131 -0
  162. package/source/components/state/style/log.pcss +111 -0
  163. package/source/components/state/style/state.pcss +113 -0
  164. package/source/components/state/stylesheet/log.mjs +27 -0
  165. package/source/components/state/stylesheet/state.mjs +27 -0
  166. package/source/components/style/badge.pcss +92 -0
  167. package/source/components/style/border.pcss +77 -0
  168. package/source/components/style/button.pcss +105 -0
  169. package/source/components/style/card.pcss +108 -0
  170. package/source/components/style/color.pcss +257 -0
  171. package/source/components/style/common.pcss +105 -0
  172. package/source/components/style/control.pcss +11 -0
  173. package/source/components/style/data-grid.pcss +43 -0
  174. package/source/components/style/display.pcss +42 -0
  175. package/source/components/style/floating-ui.pcss +33 -0
  176. package/source/components/style/form.pcss +5 -0
  177. package/source/components/style/host.pcss +15 -0
  178. package/source/components/style/link.pcss +63 -0
  179. package/source/components/style/mixin/badge.pcss +18 -0
  180. package/source/components/style/mixin/button.pcss +52 -0
  181. package/source/components/style/mixin/form.pcss +247 -0
  182. package/source/components/style/mixin/hover.pcss +8 -0
  183. package/source/components/style/mixin/media.pcss +107 -0
  184. package/source/components/style/mixin/property.pcss +292 -0
  185. package/source/components/style/mixin/skeleton.pcss +26 -0
  186. package/source/components/style/mixin/spinner.pcss +24 -0
  187. package/source/components/style/mixin/typography.pcss +52 -0
  188. package/source/components/style/normalize.pcss +14 -0
  189. package/source/components/style/popper.pcss +78 -0
  190. package/source/components/style/property.pcss +17 -0
  191. package/source/components/style/ripple.pcss +14 -0
  192. package/source/components/style/skeleton.pcss +28 -0
  193. package/source/components/style/space.pcss +47 -0
  194. package/source/components/style/spinner.pcss +6 -0
  195. package/source/components/style/table.pcss +46 -0
  196. package/source/components/style/theme.pcss +119 -0
  197. package/source/components/style/typography.pcss +131 -0
  198. package/source/components/stylesheet/badge.mjs +27 -0
  199. package/source/components/stylesheet/border.mjs +27 -0
  200. package/source/components/stylesheet/button.mjs +27 -0
  201. package/source/components/stylesheet/card.mjs +27 -0
  202. package/source/components/stylesheet/color.mjs +27 -0
  203. package/source/components/stylesheet/common.mjs +27 -0
  204. package/source/components/stylesheet/control.mjs +27 -0
  205. package/source/components/stylesheet/data-grid.mjs +27 -0
  206. package/source/components/stylesheet/display.mjs +27 -0
  207. package/source/components/stylesheet/floating-ui.mjs +27 -0
  208. package/source/components/stylesheet/form.mjs +27 -0
  209. package/source/components/stylesheet/host.mjs +27 -0
  210. package/source/components/stylesheet/link.mjs +27 -0
  211. package/source/components/stylesheet/namespace.mjs +13 -0
  212. package/source/components/stylesheet/normalize.mjs +27 -0
  213. package/source/components/stylesheet/popper.mjs +27 -0
  214. package/source/components/stylesheet/property.mjs +27 -0
  215. package/source/components/stylesheet/ripple.mjs +27 -0
  216. package/source/components/stylesheet/skeleton.mjs +27 -0
  217. package/source/components/stylesheet/space.mjs +27 -0
  218. package/source/components/stylesheet/spinner.mjs +27 -0
  219. package/source/components/stylesheet/table.mjs +27 -0
  220. package/source/components/stylesheet/theme.mjs +27 -0
  221. package/source/components/stylesheet/tree-menu.mjs +33 -0
  222. package/source/components/stylesheet/typography.mjs +27 -0
  223. package/source/components/tree-menu/namespace.mjs +13 -0
  224. package/source/components/tree-menu/style/tree-menu.pcss +107 -0
  225. package/source/components/tree-menu/stylesheet/namespace.mjs +13 -0
  226. package/source/components/tree-menu/stylesheet/tree-menu.mjs +27 -0
  227. package/source/components/tree-menu/tree-menu.mjs +660 -0
  228. package/source/constraints/abstract.mjs +17 -24
  229. package/source/constraints/abstractoperator.mjs +27 -22
  230. package/source/constraints/andoperator.mjs +20 -17
  231. package/source/constraints/invalid.mjs +17 -17
  232. package/source/constraints/isarray.mjs +20 -20
  233. package/source/constraints/isobject.mjs +20 -20
  234. package/source/constraints/oroperator.mjs +45 -45
  235. package/source/constraints/valid.mjs +17 -17
  236. package/source/data/buildmap.mjs +108 -103
  237. package/source/data/buildtree.mjs +59 -57
  238. package/source/data/datasource/dom.mjs +80 -84
  239. package/source/data/datasource/namespace.mjs +1 -1
  240. package/source/data/datasource/server/restapi/data-fetch-error.mjs +27 -25
  241. package/source/data/datasource/server/restapi/writeerror.mjs +35 -32
  242. package/source/data/datasource/server/restapi.mjs +176 -177
  243. package/source/data/datasource/server/webconnect.mjs +150 -156
  244. package/source/data/datasource/server.mjs +62 -63
  245. package/source/data/datasource/storage/localstorage.mjs +25 -24
  246. package/source/data/datasource/storage/sessionstorage.mjs +28 -25
  247. package/source/data/datasource/storage.mjs +74 -73
  248. package/source/data/datasource.mjs +177 -168
  249. package/source/data/diff.mjs +98 -97
  250. package/source/data/extend.mjs +42 -42
  251. package/source/data/pathfinder.mjs +301 -288
  252. package/source/data/pipe.mjs +36 -36
  253. package/source/data/transformer.mjs +742 -726
  254. package/source/dom/assembler.mjs +44 -44
  255. package/source/dom/attributes.mjs +142 -122
  256. package/source/dom/constants.mjs +62 -58
  257. package/source/dom/customcontrol.mjs +299 -299
  258. package/source/dom/customelement.mjs +843 -806
  259. package/source/dom/dimension.mjs +56 -46
  260. package/source/dom/events.mjs +74 -69
  261. package/source/dom/focusmanager.mjs +175 -175
  262. package/source/dom/locale.mjs +28 -28
  263. package/source/dom/ready.mjs +13 -13
  264. package/source/dom/resource/data.mjs +117 -111
  265. package/source/dom/resource/link/stylesheet.mjs +16 -16
  266. package/source/dom/resource/link.mjs +94 -96
  267. package/source/dom/resource/script.mjs +72 -74
  268. package/source/dom/resource.mjs +174 -172
  269. package/source/dom/resourcemanager.mjs +152 -156
  270. package/source/dom/slotted.mjs +78 -80
  271. package/source/dom/template.mjs +126 -112
  272. package/source/dom/theme.mjs +35 -35
  273. package/source/dom/updater.mjs +673 -651
  274. package/source/dom/util/extract-keys.mjs +34 -22
  275. package/source/dom/util/init-options-from-attributes.mjs +46 -38
  276. package/source/dom/util/namespace.mjs +13 -0
  277. package/source/dom/util/set-option-from-attribute.mjs +35 -29
  278. package/source/dom/util.mjs +112 -81
  279. package/source/dom/worker/factory.mjs +83 -83
  280. package/source/i18n/formatter.mjs +75 -73
  281. package/source/i18n/locale.mjs +146 -144
  282. package/source/i18n/provider.mjs +70 -64
  283. package/source/i18n/providers/embed.mjs +136 -127
  284. package/source/i18n/providers/fetch.mjs +84 -76
  285. package/source/i18n/translations.mjs +205 -195
  286. package/source/logging/handler/console.mjs +36 -36
  287. package/source/logging/handler.mjs +140 -140
  288. package/source/logging/logentry.mjs +25 -25
  289. package/source/logging/logger.mjs +177 -175
  290. package/source/math/random.mjs +63 -59
  291. package/source/monster.mjs +223 -103
  292. package/source/net/webconnect/message.mjs +31 -31
  293. package/source/net/webconnect.mjs +278 -271
  294. package/source/text/bracketed-key-value-hash.mjs +182 -179
  295. package/source/text/formatter.mjs +235 -210
  296. package/source/text/generate-range-comparison-expression.mjs +56 -34
  297. package/source/text/namespace.mjs +1 -1
  298. package/source/types/base.mjs +69 -61
  299. package/source/types/basewithoptions.mjs +46 -46
  300. package/source/types/binary.mjs +20 -20
  301. package/source/types/dataurl.mjs +96 -90
  302. package/source/types/global.mjs +45 -39
  303. package/source/types/id.mjs +25 -25
  304. package/source/types/internal.mjs +115 -114
  305. package/source/types/is.mjs +56 -40
  306. package/source/types/mediatype.mjs +119 -119
  307. package/source/types/namespace.mjs +1 -1
  308. package/source/types/node.mjs +160 -150
  309. package/source/types/nodelist.mjs +94 -96
  310. package/source/types/noderecursiveiterator.mjs +50 -50
  311. package/source/types/observablequeue.mjs +73 -73
  312. package/source/types/observer.mjs +114 -106
  313. package/source/types/observerlist.mjs +66 -66
  314. package/source/types/proxyobserver.mjs +210 -210
  315. package/source/types/queue.mjs +63 -63
  316. package/source/types/randomid.mjs +13 -13
  317. package/source/types/regex.mjs +3 -1
  318. package/source/types/stack.mjs +64 -64
  319. package/source/types/tokenlist.mjs +206 -205
  320. package/source/types/typeof.mjs +12 -10
  321. package/source/types/uniquequeue.mjs +48 -48
  322. package/source/types/uuid.mjs +32 -32
  323. package/source/types/validate.mjs +67 -67
  324. package/source/types/version.mjs +115 -105
  325. package/source/util/clone.mjs +103 -91
  326. package/source/util/comparator.mjs +97 -97
  327. package/source/util/deadmansswitch.mjs +40 -44
  328. package/source/util/freeze.mjs +10 -9
  329. package/source/util/namespace.mjs +1 -1
  330. package/source/util/processing.mjs +104 -105
  331. package/source/util/runtime.mjs +56 -44
  332. package/source/util/trimspaces.mjs +24 -24
  333. package/test/cases/components/form/button.mjs +122 -0
  334. package/test/cases/components/form/confirm-button.mjs +127 -0
  335. package/test/cases/components/form/form.mjs +317 -0
  336. package/test/cases/components/form/reload.mjs +188 -0
  337. package/test/cases/components/form/select.mjs +229 -0
  338. package/test/cases/components/form/state-button.mjs +130 -0
  339. package/test/cases/components/form/tabs.mjs +98 -0
  340. package/test/cases/components/form/template.mjs +189 -0
  341. package/test/cases/components/form/tree-select.mjs +216 -0
  342. package/test/cases/components/host/details.mjs +68 -0
  343. package/test/cases/components/host/host.mjs +70 -0
  344. package/test/cases/components/host/overlay.mjs +60 -0
  345. package/test/cases/components/host/util.mjs +79 -0
  346. package/test/cases/components/notify/message.mjs +39 -0
  347. package/test/cases/components/notify/notify.mjs +89 -0
  348. package/test/cases/dom/customcontrol.mjs +5 -4
  349. package/test/cases/math/random.mjs +0 -1
  350. package/test/cases/monster.mjs +1 -1
  351. package/test/cases/net/webconnect/message.mjs +0 -1
  352. package/test/cases/types/node.mjs +1 -1
  353. package/test/util/chai-dom.mjs +2 -2
  354. package/test/util/intersection-mock.mjs +69 -0
  355. package/test/util/jsdom.mjs +41 -25
  356. package/test/util/localstorage.mjs +1 -0
  357. package/test/util/resize-observer.mjs +29 -0
  358. package/test/util/websocket.mjs +4 -1
  359. package/test/web/import.js +16 -1
  360. package/test/web/test.html +28 -5
  361. package/test/web/tests.js +30398 -17879
@@ -49,293 +49,295 @@ const attachedInternalSymbol = Symbol("attachedInternal");
49
49
  * @extends Monster.DOM.CustomElement
50
50
  */
51
51
  class CustomControl extends CustomElement {
52
- /**
53
- * The constructor method of CustomControl, which is called when creating a new instance.
54
- * It checks whether the element supports `attachInternals()` and initializes an internal form-associated element
55
- * if supported. Additionally, it initializes a MutationObserver to watch for attribute changes.
56
- *
57
- * See the links below for more information:
58
- * {@link https://html.spec.whatwg.org/multipage/custom-elements.html#dom-customelementregistry-define|CustomElementRegistry.define()}
59
- * {@link https://html.spec.whatwg.org/multipage/custom-elements.html#dom-customelementregistry-get|CustomElementRegistry.get()}
60
- * and {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals|ElementInternals}
61
- *
62
- * @inheritdoc
63
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
64
- * @since 1.7.0
65
- */
66
- constructor() {
67
- super();
68
-
69
- // check if element supports `attachInternals()`
70
- if (typeof this["attachInternals"] === "function") {
71
- this[attachedInternalSymbol] = this.attachInternals();
72
- } else {
73
- // `attachInternals()` is not supported, so a polyfill is necessary
74
- throw Error("the ElementInternals is not supported and a polyfill is necessary");
75
- }
76
-
77
- // initialize a MutationObserver to watch for attribute changes
78
- initObserver.call(this);
79
- }
80
-
81
- /**
82
- * This method is called by the `instanceof` operator.
83
- * @returns {symbol}
84
- * @since 2.1.0
85
- */
86
- static get [instanceSymbol]() {
87
- return Symbol.for("@schukai/monster/dom/custom-control@@instance");
88
- }
89
-
90
- /**
91
- * This method determines which attributes are to be monitored by `attributeChangedCallback()`.
92
- *
93
- * @return {string[]}
94
- * @since 1.15.0
95
- */
96
- static get observedAttributes() {
97
- return super.observedAttributes;
98
- }
99
-
100
- /**
101
- * Adding a static `formAssociated` property, with a true value, makes an autonomous custom element a form-associated custom element.
102
- *
103
- * @see [attachInternals()]{@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals}
104
- * @see [Custom Elements Face Example]{@link https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-face-example}
105
- * @since 1.14.0
106
- * @return {boolean}
107
- */
108
- static formAssociated = true;
109
-
110
- /**
111
- * @inheritdoc
112
- * @since 1.14.0
113
- **/
114
- get defaults() {
115
- return extend({}, super.defaults);
116
- }
117
-
118
- /**
119
- * Must be overridden by a derived class and return the value of the control.
120
- *
121
- * This is a method of [internal API](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals), which is a part of the web standard for custom elements.
122
- *
123
- * @since 1.14.0
124
- * @throws {Error} the value getter must be overwritten by the derived class
125
- */
126
- get value() {
127
- throw Error("the value getter must be overwritten by the derived class");
128
- }
129
-
130
- /**
131
- * Must be overridden by a derived class and set the value of the control.
132
- *
133
- * This is a method of [internal API](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals), which is a part of the web standard for custom elements.
134
- *
135
- * @param {*} value The value to set.
136
- * @since 1.14.0
137
- * @throws {Error} the value setter must be overwritten by the derived class
138
- */
139
- set value(value) {
140
- throw Error("the value setter must be overwritten by the derived class");
141
- }
142
-
143
- /**
144
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
145
- *
146
- * @return {NodeList}
147
- * @since 1.14.0
148
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels}
149
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
150
- */
151
- get labels() {
152
- return getInternal.call(this)?.labels;
153
- }
154
-
155
- /**
156
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
157
- *
158
- * @return {string|null}
159
- */
160
- get name() {
161
- return this.getAttribute("name");
162
- }
163
-
164
- /**
165
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
166
- *
167
- * @return {string}
168
- */
169
- get type() {
170
- return this.constructor.getTag();
171
- }
172
-
173
- /**
174
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
175
- *
176
- * @return {ValidityState}
177
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
178
- * @see [ValidityState]{@link https://developer.mozilla.org/en-US/docs/Web/API/ValidityState}
179
- * @see [validity]{@link https://developer.mozilla.org/en-US/docs/Web/API/validity}
180
- */
181
- get validity() {
182
- return getInternal.call(this)?.validity;
183
- }
184
-
185
- /**
186
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
187
- *
188
- * @return {string}
189
- * @since 1.14.0
190
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/validationMessage
191
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
192
- */
193
- get validationMessage() {
194
- return getInternal.call(this)?.validationMessage;
195
- }
196
-
197
- /**
198
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
199
- *
200
- * @return {boolean}
201
- * @since 1.14.0
202
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
203
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
204
- */
205
- get willValidate() {
206
- return getInternal.call(this)?.willValidate;
207
- }
208
-
209
- /**
210
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
211
- *
212
- * @return {boolean}
213
- * @since 1.14.0
214
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/states
215
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
216
- */
217
- get states() {
218
- return getInternal.call(this)?.states;
219
- }
220
-
221
- /**
222
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
223
- *
224
- * @return {HTMLFontElement|null}
225
- * @since 1.14.0
226
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form
227
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
228
- */
229
- get form() {
230
- return getInternal.call(this)?.form;
231
- }
232
-
233
- /**
234
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
235
- *
236
- * ```
237
- * // Use the control's name as the base name for submitted data
238
- * const n = this.getAttribute('name');
239
- * const entries = new FormData();
240
- * entries.append(n + '-first-name', this.firstName_);
241
- * entries.append(n + '-last-name', this.lastName_);
242
- * this.setFormValue(entries);
243
- * ```
244
- *
245
- * @param {File|string|FormData} value
246
- * @param {File|string|FormData} state
247
- * @since 1.14.0
248
- * @return {undefined}
249
- * @throws {DOMException} NotSupportedError
250
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
251
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/setFormValue
252
- */
253
- setFormValue(value, state) {
254
- getInternal.call(this).setFormValue(value, state);
255
- }
256
-
257
- /**
258
- *
259
- * @param {object} flags
260
- * @param {string|undefined} message
261
- * @param {HTMLElement} anchor
262
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/setValidity
263
- * @since 1.14.0
264
- * @return {undefined}
265
- * @throws {DOMException} NotSupportedError
266
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
267
- */
268
- setValidity(flags, message, anchor) {
269
- getInternal.call(this).setValidity(flags, message, anchor);
270
- }
271
-
272
- /**
273
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
274
- *
275
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/checkValidity
276
- * @since 1.14.0
277
- * @return {boolean}
278
- * @throws {DOMException} NotSupportedError
279
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
280
- */
281
- checkValidity() {
282
- return getInternal.call(this)?.checkValidity();
283
- }
284
-
285
- /**
286
- * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
287
- *
288
- * @return {boolean}
289
- * @since 1.14.0
290
- * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/reportValidity
291
- * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
292
- * @throws {DOMException} NotSupportedError
293
- */
294
- reportValidity() {
295
- return getInternal.call(this)?.reportValidity();
296
- }
297
-
298
- /**
299
- * Sets the `form` attribute of the custom control to the `id` of the passed form element.
300
- * If no form element is passed, removes the `form` attribute.
301
- *
302
- * @param {HTMLFormElement} form - The form element to associate with the control
303
- */
304
- formAssociatedCallback(form) {
305
- if (form) {
306
- if (form.id) {
307
- this.setAttribute("form", form.id);
308
- }
309
- } else {
310
- this.removeAttribute("form");
311
- }
312
- }
313
-
314
- /**
315
- * Sets or removes the `disabled` attribute of the custom control based on the passed value.
316
- *
317
- * @param {boolean} disabled - Whether or not the control should be disabled
318
- */
319
- formDisabledCallback(disabled) {
320
- if (disabled) {
321
- this.setAttribute("disabled", "");
322
- } else {
323
- this.removeAttribute("disabled");
324
- }
325
- }
326
-
327
- /**
328
- * @param {string} state
329
- * @param {string} mode
330
- */
331
- formStateRestoreCallback(state, mode) {}
332
-
333
- /**
334
- *
335
- */
336
- formResetCallback() {
337
- this.value = "";
338
- }
52
+ /**
53
+ * The constructor method of CustomControl, which is called when creating a new instance.
54
+ * It checks whether the element supports `attachInternals()` and initializes an internal form-associated element
55
+ * if supported. Additionally, it initializes a MutationObserver to watch for attribute changes.
56
+ *
57
+ * See the links below for more information:
58
+ * {@link https://html.spec.whatwg.org/multipage/custom-elements.html#dom-customelementregistry-define|CustomElementRegistry.define()}
59
+ * {@link https://html.spec.whatwg.org/multipage/custom-elements.html#dom-customelementregistry-get|CustomElementRegistry.get()}
60
+ * and {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals|ElementInternals}
61
+ *
62
+ * @inheritdoc
63
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
64
+ * @since 1.7.0
65
+ */
66
+ constructor() {
67
+ super();
68
+
69
+ // check if element supports `attachInternals()`
70
+ if (typeof this["attachInternals"] === "function") {
71
+ this[attachedInternalSymbol] = this.attachInternals();
72
+ } else {
73
+ // `attachInternals()` is not supported, so a polyfill is necessary
74
+ throw Error(
75
+ "the ElementInternals is not supported and a polyfill is necessary",
76
+ );
77
+ }
78
+
79
+ // initialize a MutationObserver to watch for attribute changes
80
+ initObserver.call(this);
81
+ }
82
+
83
+ /**
84
+ * This method is called by the `instanceof` operator.
85
+ * @returns {symbol}
86
+ * @since 2.1.0
87
+ */
88
+ static get [instanceSymbol]() {
89
+ return Symbol.for("@schukai/monster/dom/custom-control@@instance");
90
+ }
91
+
92
+ /**
93
+ * This method determines which attributes are to be monitored by `attributeChangedCallback()`.
94
+ *
95
+ * @return {string[]}
96
+ * @since 1.15.0
97
+ */
98
+ static get observedAttributes() {
99
+ return super.observedAttributes;
100
+ }
101
+
102
+ /**
103
+ * Adding a static `formAssociated` property, with a true value, makes an autonomous custom element a form-associated custom element.
104
+ *
105
+ * @see [attachInternals()]{@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals}
106
+ * @see [Custom Elements Face Example]{@link https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-face-example}
107
+ * @since 1.14.0
108
+ * @return {boolean}
109
+ */
110
+ static formAssociated = true;
111
+
112
+ /**
113
+ * @inheritdoc
114
+ * @since 1.14.0
115
+ **/
116
+ get defaults() {
117
+ return extend({}, super.defaults);
118
+ }
119
+
120
+ /**
121
+ * Must be overridden by a derived class and return the value of the control.
122
+ *
123
+ * This is a method of [internal API](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals), which is a part of the web standard for custom elements.
124
+ *
125
+ * @since 1.14.0
126
+ * @throws {Error} the value getter must be overwritten by the derived class
127
+ */
128
+ get value() {
129
+ throw Error("the value getter must be overwritten by the derived class");
130
+ }
131
+
132
+ /**
133
+ * Must be overridden by a derived class and set the value of the control.
134
+ *
135
+ * This is a method of [internal API](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals), which is a part of the web standard for custom elements.
136
+ *
137
+ * @param {*} value The value to set.
138
+ * @since 1.14.0
139
+ * @throws {Error} the value setter must be overwritten by the derived class
140
+ */
141
+ set value(value) {
142
+ throw Error("the value setter must be overwritten by the derived class");
143
+ }
144
+
145
+ /**
146
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
147
+ *
148
+ * @return {NodeList}
149
+ * @since 1.14.0
150
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels}
151
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
152
+ */
153
+ get labels() {
154
+ return getInternal.call(this)?.labels;
155
+ }
156
+
157
+ /**
158
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
159
+ *
160
+ * @return {string|null}
161
+ */
162
+ get name() {
163
+ return this.getAttribute("name");
164
+ }
165
+
166
+ /**
167
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
168
+ *
169
+ * @return {string}
170
+ */
171
+ get type() {
172
+ return this.constructor.getTag();
173
+ }
174
+
175
+ /**
176
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
177
+ *
178
+ * @return {ValidityState}
179
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
180
+ * @see [ValidityState]{@link https://developer.mozilla.org/en-US/docs/Web/API/ValidityState}
181
+ * @see [validity]{@link https://developer.mozilla.org/en-US/docs/Web/API/validity}
182
+ */
183
+ get validity() {
184
+ return getInternal.call(this)?.validity;
185
+ }
186
+
187
+ /**
188
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
189
+ *
190
+ * @return {string}
191
+ * @since 1.14.0
192
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/validationMessage
193
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
194
+ */
195
+ get validationMessage() {
196
+ return getInternal.call(this)?.validationMessage;
197
+ }
198
+
199
+ /**
200
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
201
+ *
202
+ * @return {boolean}
203
+ * @since 1.14.0
204
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
205
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
206
+ */
207
+ get willValidate() {
208
+ return getInternal.call(this)?.willValidate;
209
+ }
210
+
211
+ /**
212
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
213
+ *
214
+ * @return {boolean}
215
+ * @since 1.14.0
216
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/states
217
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
218
+ */
219
+ get states() {
220
+ return getInternal.call(this)?.states;
221
+ }
222
+
223
+ /**
224
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
225
+ *
226
+ * @return {HTMLFontElement|null}
227
+ * @since 1.14.0
228
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form
229
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
230
+ */
231
+ get form() {
232
+ return getInternal.call(this)?.form;
233
+ }
234
+
235
+ /**
236
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
237
+ *
238
+ * ```
239
+ * // Use the control's name as the base name for submitted data
240
+ * const n = this.getAttribute('name');
241
+ * const entries = new FormData();
242
+ * entries.append(n + '-first-name', this.firstName_);
243
+ * entries.append(n + '-last-name', this.lastName_);
244
+ * this.setFormValue(entries);
245
+ * ```
246
+ *
247
+ * @param {File|string|FormData} value
248
+ * @param {File|string|FormData} state
249
+ * @since 1.14.0
250
+ * @return {undefined}
251
+ * @throws {DOMException} NotSupportedError
252
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
253
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/setFormValue
254
+ */
255
+ setFormValue(value, state) {
256
+ getInternal.call(this).setFormValue(value, state);
257
+ }
258
+
259
+ /**
260
+ *
261
+ * @param {object} flags
262
+ * @param {string|undefined} message
263
+ * @param {HTMLElement} anchor
264
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/setValidity
265
+ * @since 1.14.0
266
+ * @return {undefined}
267
+ * @throws {DOMException} NotSupportedError
268
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
269
+ */
270
+ setValidity(flags, message, anchor) {
271
+ getInternal.call(this).setValidity(flags, message, anchor);
272
+ }
273
+
274
+ /**
275
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
276
+ *
277
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/checkValidity
278
+ * @since 1.14.0
279
+ * @return {boolean}
280
+ * @throws {DOMException} NotSupportedError
281
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
282
+ */
283
+ checkValidity() {
284
+ return getInternal.call(this)?.checkValidity();
285
+ }
286
+
287
+ /**
288
+ * This is a method of [internal api](https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals)
289
+ *
290
+ * @return {boolean}
291
+ * @since 1.14.0
292
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/reportValidity
293
+ * @throws {Error} the ElementInternals is not supported and a polyfill is necessary
294
+ * @throws {DOMException} NotSupportedError
295
+ */
296
+ reportValidity() {
297
+ return getInternal.call(this)?.reportValidity();
298
+ }
299
+
300
+ /**
301
+ * Sets the `form` attribute of the custom control to the `id` of the passed form element.
302
+ * If no form element is passed, removes the `form` attribute.
303
+ *
304
+ * @param {HTMLFormElement} form - The form element to associate with the control
305
+ */
306
+ formAssociatedCallback(form) {
307
+ if (form) {
308
+ if (form.id) {
309
+ this.setAttribute("form", form.id);
310
+ }
311
+ } else {
312
+ this.removeAttribute("form");
313
+ }
314
+ }
315
+
316
+ /**
317
+ * Sets or removes the `disabled` attribute of the custom control based on the passed value.
318
+ *
319
+ * @param {boolean} disabled - Whether or not the control should be disabled
320
+ */
321
+ formDisabledCallback(disabled) {
322
+ if (disabled) {
323
+ this.setAttribute("disabled", "");
324
+ } else {
325
+ this.removeAttribute("disabled");
326
+ }
327
+ }
328
+
329
+ /**
330
+ * @param {string} state
331
+ * @param {string} mode
332
+ */
333
+ formStateRestoreCallback(state, mode) {}
334
+
335
+ /**
336
+ *
337
+ */
338
+ formResetCallback() {
339
+ this.value = "";
340
+ }
339
341
  }
340
342
 
341
343
  /**
@@ -345,13 +347,13 @@ class CustomControl extends CustomElement {
345
347
  * @this CustomControl
346
348
  */
347
349
  function getInternal() {
348
- const self = this;
349
-
350
- if (!(attachedInternalSymbol in this)) {
351
- throw new Error("ElementInternals is not supported and a polyfill is necessary");
352
- }
350
+ if (!(attachedInternalSymbol in this)) {
351
+ throw new Error(
352
+ "ElementInternals is not supported and a polyfill is necessary",
353
+ );
354
+ }
353
355
 
354
- return self[attachedInternalSymbol];
356
+ return this[attachedInternalSymbol];
355
357
  }
356
358
 
357
359
  /**
@@ -360,10 +362,8 @@ function getInternal() {
360
362
  * @this CustomControl
361
363
  */
362
364
  function initObserver() {
363
- const self = this;
364
-
365
- // value
366
- self[attributeObserverSymbol]["value"] = () => {
367
- self.setOption("value", self.getAttribute("value"));
368
- };
365
+ // value
366
+ this[attributeObserverSymbol]["value"] = () => {
367
+ this.setOption("value", this.getAttribute("value"));
368
+ };
369
369
  }