@schukai/monster 3.64.1 → 3.65.20
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 +92 -318
- package/README.md +44 -40
- package/package.json +1 -47
- package/source/components/constants.mjs +10 -3
- package/source/components/datatable/change-button.mjs +12 -5
- package/source/components/datatable/columnbar.mjs +10 -1
- package/source/components/datatable/constants.mjs +11 -4
- package/source/components/datatable/dataset.mjs +10 -1
- package/source/components/datatable/datasource/dom.mjs +14 -1
- package/source/components/datatable/datasource/rest.mjs +10 -1
- package/source/components/datatable/datasource.mjs +10 -1
- package/source/components/datatable/datatable/header.mjs +12 -3
- package/source/components/datatable/datatable.mjs +757 -752
- package/source/components/datatable/embedded-pagination.mjs +10 -1
- package/source/components/datatable/filter/abstract-base.mjs +10 -1
- package/source/components/datatable/filter/date-range.mjs +10 -1
- package/source/components/datatable/filter/input.mjs +10 -1
- package/source/components/datatable/filter/range.mjs +10 -1
- package/source/components/datatable/filter/select.mjs +11 -4
- package/source/components/datatable/filter/settings.mjs +14 -0
- package/source/components/datatable/filter/util.mjs +14 -0
- package/source/components/datatable/filter-button.mjs +10 -1
- package/source/components/datatable/filter.mjs +11 -3
- package/source/components/datatable/pagination.mjs +14 -5
- package/source/components/datatable/save-button.mjs +279 -270
- package/source/components/datatable/status.mjs +10 -1
- package/source/components/datatable/style/dataset.pcss +1 -0
- package/source/components/datatable/style/datatable.pcss +1 -0
- package/source/components/datatable/stylesheet/change-button.mjs +16 -7
- package/source/components/datatable/stylesheet/column-bar.mjs +16 -7
- package/source/components/datatable/stylesheet/dataset.mjs +17 -8
- package/source/components/datatable/stylesheet/datasource.mjs +16 -7
- package/source/components/datatable/stylesheet/datatable.mjs +17 -8
- package/source/components/datatable/stylesheet/embedded-pagination.mjs +16 -7
- package/source/components/datatable/stylesheet/filter-button.mjs +16 -7
- package/source/components/datatable/stylesheet/filter-controls-defaults.mjs +16 -7
- package/source/components/datatable/stylesheet/filter-date-range.mjs +16 -7
- package/source/components/datatable/stylesheet/filter-range.mjs +16 -7
- package/source/components/datatable/stylesheet/filter.mjs +16 -7
- package/source/components/datatable/stylesheet/pagination.mjs +16 -7
- package/source/components/datatable/stylesheet/save-button.mjs +16 -7
- package/source/components/datatable/stylesheet/select-filter.mjs +16 -7
- package/source/components/datatable/stylesheet/status.mjs +16 -7
- package/source/components/datatable/util.mjs +16 -8
- package/source/components/form/action-button.mjs +11 -3
- package/source/components/form/api-button.mjs +11 -3
- package/source/components/form/button-bar.mjs +11 -3
- package/source/components/form/button.mjs +37 -50
- package/source/components/form/confirm-button.mjs +11 -3
- package/source/components/form/constants.mjs +10 -3
- package/source/components/form/context-error.mjs +69 -52
- package/source/components/form/context-help.mjs +11 -3
- package/source/components/form/field-set.mjs +295 -0
- package/source/components/form/form.mjs +12 -4
- package/source/components/form/message-state-button.mjs +11 -3
- package/source/components/form/popper-button.mjs +11 -3
- package/source/components/form/popper.mjs +13 -480
- package/source/components/form/reload.mjs +12 -4
- package/source/components/form/select.mjs +44 -33
- package/source/components/form/shadow-reload.mjs +11 -3
- package/source/components/form/state-button.mjs +11 -3
- package/source/components/form/style/field-set.pcss +13 -0
- package/source/components/form/stylesheet/action-button.mjs +16 -7
- package/source/components/form/stylesheet/api-button.mjs +16 -7
- package/source/components/form/stylesheet/button-bar.mjs +17 -8
- package/source/components/form/stylesheet/button.mjs +16 -7
- package/source/components/form/stylesheet/confirm-button.mjs +17 -8
- package/source/components/form/stylesheet/context-error.mjs +16 -7
- package/source/components/form/stylesheet/context-help.mjs +16 -7
- package/source/components/form/stylesheet/field-set.mjs +40 -0
- package/source/components/form/stylesheet/form.mjs +17 -8
- package/source/components/form/stylesheet/message-state-button.mjs +16 -7
- package/source/components/form/stylesheet/popper-button.mjs +16 -7
- package/source/components/form/stylesheet/select.mjs +16 -7
- package/source/components/form/stylesheet/state-button.mjs +16 -7
- package/source/components/form/stylesheet/toggle-switch.mjs +16 -7
- package/source/components/form/stylesheet/tree-select.mjs +16 -7
- package/source/components/form/tabs.mjs +12 -8
- package/source/components/form/template.mjs +11 -3
- package/source/components/form/toggle-switch.mjs +12 -8
- package/source/components/form/tree-select.mjs +10 -3
- package/source/components/form/types/state.mjs +10 -3
- package/source/components/form/util/fetch.mjs +10 -3
- package/source/components/form/util/floating-ui.mjs +10 -3
- package/source/components/form/util/popper.mjs +10 -3
- package/source/components/host/call-button.mjs +10 -1
- package/source/components/host/collapse.mjs +15 -519
- package/source/components/host/config-manager.mjs +10 -1
- package/source/components/host/constants.mjs +11 -4
- package/source/components/host/details.mjs +14 -256
- package/source/components/host/host.mjs +10 -1
- package/source/components/host/overlay.mjs +10 -1
- package/source/components/host/stylesheet/call-button.mjs +16 -7
- package/source/components/host/stylesheet/config-manager.mjs +16 -7
- package/source/components/host/stylesheet/host.mjs +17 -8
- package/source/components/host/stylesheet/overlay.mjs +17 -8
- package/source/components/host/stylesheet/toggle-button.mjs +16 -7
- package/source/components/host/stylesheet/viewer.mjs +16 -7
- package/source/components/host/toggle-button.mjs +10 -1
- package/source/components/host/util.mjs +14 -0
- package/source/components/host/viewer.mjs +10 -1
- package/source/components/layout/collapse.mjs +543 -0
- package/source/components/layout/details.mjs +273 -0
- package/source/components/layout/panel.mjs +179 -169
- package/source/components/layout/popper.mjs +480 -0
- package/source/components/layout/split-panel.mjs +329 -303
- package/source/components/{host → layout}/stylesheet/collapse.mjs +16 -7
- package/source/components/{host → layout}/stylesheet/details.mjs +16 -7
- package/source/components/layout/stylesheet/panel.mjs +16 -7
- package/source/components/{form → layout}/stylesheet/popper.mjs +16 -7
- package/source/components/layout/stylesheet/split-panel.mjs +16 -7
- package/source/components/layout/stylesheet/tabs.mjs +16 -7
- package/source/components/layout/stylesheet/width-toggle.mjs +16 -7
- package/source/components/layout/tabs.mjs +38 -23
- package/source/components/layout/width-toggle.mjs +150 -140
- package/source/components/navigation/style/table-of-content.pcss +99 -0
- package/source/components/navigation/stylesheet/table-of-content.mjs +40 -0
- package/source/components/navigation/table-of-content.mjs +546 -0
- package/source/components/notify/constants.mjs +10 -3
- package/source/components/notify/message.mjs +16 -9
- package/source/components/notify/notify.mjs +11 -4
- package/source/components/notify/stylesheet/message.mjs +16 -7
- package/source/components/notify/stylesheet/notify.mjs +16 -7
- package/source/components/state/log/entry.mjs +10 -1
- package/source/components/state/log.mjs +10 -1
- package/source/components/state/state.mjs +10 -1
- package/source/components/state/stylesheet/log.mjs +16 -7
- package/source/components/state/stylesheet/state.mjs +17 -8
- package/source/components/style/link.pcss +0 -1
- package/source/components/style/mixin/form.pcss +0 -1
- package/source/components/style/mixin/typography.pcss +7 -7
- package/source/components/style/typography.pcss +1 -1
- package/source/components/stylesheet/badge.mjs +16 -7
- package/source/components/stylesheet/border.mjs +16 -7
- package/source/components/stylesheet/button.mjs +16 -7
- package/source/components/stylesheet/card.mjs +16 -7
- package/source/components/stylesheet/color.mjs +16 -7
- package/source/components/stylesheet/common.mjs +16 -7
- package/source/components/stylesheet/control.mjs +16 -7
- package/source/components/stylesheet/data-grid.mjs +16 -7
- package/source/components/stylesheet/display.mjs +16 -7
- package/source/components/stylesheet/floating-ui.mjs +16 -7
- package/source/components/stylesheet/form.mjs +16 -7
- package/source/components/stylesheet/host.mjs +16 -7
- package/source/components/stylesheet/icons.mjs +16 -7
- package/source/components/stylesheet/link.mjs +16 -7
- package/source/components/stylesheet/mixin/badge.mjs +16 -7
- package/source/components/stylesheet/mixin/button.mjs +16 -7
- package/source/components/stylesheet/mixin/form.mjs +16 -7
- package/source/components/stylesheet/mixin/hover.mjs +16 -7
- package/source/components/stylesheet/mixin/icon.mjs +16 -7
- package/source/components/stylesheet/mixin/media.mjs +16 -7
- package/source/components/stylesheet/mixin/property.mjs +16 -7
- package/source/components/stylesheet/mixin/skeleton.mjs +16 -7
- package/source/components/stylesheet/mixin/spinner.mjs +16 -7
- package/source/components/stylesheet/mixin/typography.mjs +16 -7
- package/source/components/stylesheet/normalize.mjs +16 -7
- package/source/components/stylesheet/popper.mjs +16 -7
- package/source/components/stylesheet/property.mjs +16 -7
- package/source/components/stylesheet/ripple.mjs +16 -7
- package/source/components/stylesheet/skeleton.mjs +16 -7
- package/source/components/stylesheet/space.mjs +16 -7
- package/source/components/stylesheet/spinner.mjs +16 -7
- package/source/components/stylesheet/table.mjs +16 -7
- package/source/components/stylesheet/theme.mjs +16 -7
- package/source/components/stylesheet/tree-menu.mjs +10 -3
- package/source/components/stylesheet/typography.mjs +17 -8
- package/source/components/tree-menu/stylesheet/tree-menu.mjs +16 -7
- package/source/components/tree-menu/tree-menu.mjs +19 -8
- package/source/constants.mjs +10 -6
- package/source/constraints/abstract.mjs +10 -3
- package/source/constraints/abstractoperator.mjs +10 -3
- package/source/constraints/andoperator.mjs +10 -3
- package/source/constraints/invalid.mjs +10 -3
- package/source/constraints/isarray.mjs +10 -3
- package/source/constraints/isobject.mjs +10 -3
- package/source/constraints/oroperator.mjs +10 -3
- package/source/constraints/valid.mjs +10 -3
- package/source/data/buildmap.mjs +10 -3
- package/source/data/buildtree.mjs +10 -3
- package/source/data/datasource/dom.mjs +10 -3
- package/source/data/datasource/server/restapi/data-fetch-error.mjs +10 -3
- package/source/data/datasource/server/restapi/writeerror.mjs +10 -3
- package/source/data/datasource/server/restapi.mjs +10 -3
- package/source/data/datasource/server/webconnect.mjs +10 -3
- package/source/data/datasource/server.mjs +10 -3
- package/source/data/datasource/storage/localstorage.mjs +10 -3
- package/source/data/datasource/storage/sessionstorage.mjs +10 -3
- package/source/data/datasource/storage.mjs +10 -3
- package/source/data/datasource.mjs +10 -3
- package/source/data/diff.mjs +10 -3
- package/source/data/extend.mjs +10 -3
- package/source/data/pathfinder.mjs +10 -3
- package/source/data/pipe.mjs +10 -3
- package/source/data/transformer.mjs +34 -10
- package/source/dom/assembler.mjs +10 -3
- package/source/dom/attributes.mjs +10 -3
- package/source/dom/constants.mjs +10 -3
- package/source/dom/customcontrol.mjs +11 -4
- package/source/dom/customelement.mjs +31 -17
- package/source/dom/dimension.mjs +10 -3
- package/source/dom/events.mjs +10 -3
- package/source/dom/focusmanager.mjs +10 -3
- package/source/dom/locale.mjs +10 -3
- package/source/dom/ready.mjs +11 -4
- package/source/dom/resource/data.mjs +10 -3
- package/source/dom/resource/link/stylesheet.mjs +10 -3
- package/source/dom/resource/link.mjs +10 -3
- package/source/dom/resource/script.mjs +10 -3
- package/source/dom/resource.mjs +10 -3
- package/source/dom/resourcemanager.mjs +10 -3
- package/source/dom/slotted.mjs +14 -0
- package/source/dom/template.mjs +124 -136
- package/source/dom/theme.mjs +10 -3
- package/source/dom/updater.mjs +10 -3
- package/source/dom/util/extract-keys.mjs +10 -3
- package/source/dom/util/init-options-from-attributes.mjs +68 -61
- package/source/dom/util/set-option-from-attribute.mjs +10 -3
- package/source/dom/util.mjs +11 -4
- package/source/dom/worker/factory.mjs +10 -3
- package/source/i18n/formatter.mjs +10 -3
- package/source/i18n/locale.mjs +10 -3
- package/source/i18n/provider.mjs +10 -3
- package/source/i18n/providers/embed.mjs +10 -3
- package/source/i18n/providers/fetch.mjs +10 -3
- package/source/i18n/translations.mjs +10 -3
- package/source/logging/handler/console.mjs +10 -3
- package/source/logging/handler.mjs +10 -3
- package/source/logging/logentry.mjs +10 -3
- package/source/logging/logger.mjs +10 -3
- package/source/math/random.mjs +10 -3
- package/source/monster.mjs +8 -93
- package/source/net/webconnect/message.mjs +10 -3
- package/source/net/webconnect.mjs +20 -5
- package/source/text/bracketed-key-value-hash.mjs +10 -3
- package/source/text/formatter.mjs +10 -3
- package/source/text/generate-range-comparison-expression.mjs +10 -3
- package/source/text/util.mjs +14 -0
- package/source/types/base.mjs +10 -3
- package/source/types/basewithoptions.mjs +10 -3
- package/source/types/binary.mjs +10 -3
- package/source/types/dataurl.mjs +10 -3
- package/source/types/global.mjs +14 -7
- package/source/types/id.mjs +10 -3
- package/source/types/internal.mjs +11 -3
- package/source/types/is.mjs +10 -3
- package/source/types/mediatype.mjs +10 -3
- package/source/types/node.mjs +10 -3
- package/source/types/nodelist.mjs +10 -3
- package/source/types/noderecursiveiterator.mjs +10 -3
- package/source/types/observablequeue.mjs +10 -3
- package/source/types/observer.mjs +10 -3
- package/source/types/observerlist.mjs +10 -3
- package/source/types/proxyobserver.mjs +14 -5
- package/source/types/queue.mjs +10 -3
- package/source/types/randomid.mjs +10 -3
- package/source/types/regex.mjs +10 -3
- package/source/types/stack.mjs +10 -3
- package/source/types/tokenlist.mjs +10 -3
- package/source/types/typeof.mjs +10 -3
- package/source/types/uniquequeue.mjs +10 -3
- package/source/types/uuid.mjs +10 -3
- package/source/types/validate.mjs +10 -3
- package/source/types/version.mjs +11 -4
- package/source/util/clone.mjs +10 -3
- package/source/util/comparator.mjs +10 -3
- package/source/util/deadmansswitch.mjs +10 -3
- package/source/util/freeze.mjs +10 -3
- package/source/util/processing.mjs +10 -3
- package/source/util/runtime.mjs +10 -7
- package/source/util/sleep.mjs +10 -10
- package/source/util/trimspaces.mjs +10 -3
- package/test/cases/data/datasource/server/websocket.mjs +7 -9
- package/test/cases/data/transformer.mjs +47 -15
- package/test/cases/dom/customcontrol.mjs +0 -1
- package/test/cases/dom/customelement.mjs +1 -3
- package/test/cases/dom/template.mjs +3 -1
- package/test/cases/monster.mjs +1 -1
- package/test/util/jsdom.mjs +8 -7
- package/test/util/websocket.mjs +5 -1
- package/test/web/import.js +2 -1
- package/test/web/puppeteer.mjs +111 -0
- package/test/web/test.html +2 -2
- package/test/web/tests.js +2039 -1192
- package/example/components/form/button.mjs +0 -10
- package/example/components/form/select.mjs +0 -25
- package/example/components/form/toggle-switch.mjs +0 -7
- package/example/components/form/tree-select.mjs +0 -27
- package/example/components/host/host.mjs +0 -0
- package/example/components/notify/message.mjs +0 -4
- package/example/components/notify/notify.mjs +0 -4
- package/example/components/state/log.mjs +0 -0
- package/example/components/state/state.mjs +0 -0
- package/example/constraints/andoperator.mjs +0 -17
- package/example/constraints/invalid.mjs +0 -6
- package/example/constraints/isarray.mjs +0 -11
- package/example/constraints/isobject.mjs +0 -12
- package/example/constraints/oroperator.mjs +0 -15
- package/example/constraints/valid.mjs +0 -6
- package/example/data/buildmap.mjs +0 -67
- package/example/data/datasource/server/restapi.mjs +0 -20
- package/example/data/datasource/server/webconnect.mjs +0 -9
- package/example/data/datasource.mjs +0 -7
- package/example/data/diff.mjs +0 -39
- package/example/data/pathfinder-1.mjs +0 -23
- package/example/data/pathfinder-2.mjs +0 -19
- package/example/data/pipe.mjs +0 -14
- package/example/data/transformer.mjs +0 -9
- package/example/dom/customelement.mjs +0 -14
- package/example/dom/theme.mjs +0 -5
- package/example/dom/updater.mjs +0 -23
- package/example/i18n/formatter.mjs +0 -10
- package/example/i18n/providers/embed.mjs +0 -5
- package/example/i18n/providers/fetch.mjs +0 -5
- package/example/i18n/translations.mjs +0 -20
- package/example/net/webconnect.mjs +0 -16
- package/example/types/basewithoptions.mjs +0 -10
- package/example/types/is-1.mjs +0 -5
- package/example/types/is-10.mjs +0 -6
- package/example/types/is-2.mjs +0 -4
- package/example/types/is-3.mjs +0 -4
- package/example/types/is-4.mjs +0 -5
- package/example/types/is-5.mjs +0 -4
- package/example/types/is-6.mjs +0 -4
- package/example/types/is-7.mjs +0 -4
- package/example/types/is-8.mjs +0 -4
- package/example/types/is-9.mjs +0 -6
- package/example/types/noderecursiveiterator.mjs +0 -32
- package/example/types/observer.mjs +0 -9
- package/example/types/proxyobserver.mjs +0 -25
- package/example/types/queue.mjs +0 -20
- package/example/types/tokenlist-1.mjs +0 -4
- package/example/types/tokenlist-2.mjs +0 -7
- package/example/types/tokenlist-3.mjs +0 -5
- package/example/types/tokenlist-4.mjs +0 -5
- package/example/types/tokenlist-5.mjs +0 -5
- package/example/types/typeof.mjs +0 -9
- package/example/types/version-1.mjs +0 -6
- package/example/types/version-2.mjs +0 -3
- package/example/util/comparator.mjs +0 -10
- package/example/util/deadmansswitch.mjs +0 -9
- package/example/util/processing.mjs +0 -17
- package/source/components/datatable/datasource/namespace.mjs +0 -13
- package/source/components/datatable/datatable/namespace.mjs +0 -13
- package/source/components/datatable/events.mjs +0 -24
- package/source/components/datatable/filter/namespace.mjs +0 -13
- package/source/components/datatable/namespace.mjs +0 -11
- package/source/components/datatable/stylesheet/namespace.mjs +0 -13
- package/source/components/events.mjs +0 -17
- package/source/components/form/events.mjs +0 -108
- package/source/components/form/form-field.mjs +0 -341
- package/source/components/form/namespace.mjs +0 -13
- package/source/components/form/style/form-field.pcss +0 -4
- package/source/components/form/stylesheet/form-field.mjs +0 -31
- package/source/components/form/stylesheet/namespace.mjs +0 -13
- package/source/components/form/types/namespace.mjs +0 -13
- package/source/components/form/util/namespace.mjs +0 -13
- package/source/components/host/events.mjs +0 -131
- package/source/components/host/namespace.mjs +0 -13
- package/source/components/host/stylesheet/namespace.mjs +0 -13
- package/source/components/layout/events.mjs +0 -30
- package/source/components/layout/namespace.mjs +0 -13
- package/source/components/namespace.mjs +0 -14
- package/source/components/notify/events.mjs +0 -15
- package/source/components/notify/namespace.mjs +0 -15
- package/source/components/notify/stylesheet/namespace.mjs +0 -15
- package/source/components/state/log/namespace.mjs +0 -13
- package/source/components/state/namespace.mjs +0 -13
- package/source/components/stylesheet/namespace.mjs +0 -13
- package/source/components/tree-menu/namespace.mjs +0 -13
- package/source/components/tree-menu/stylesheet/namespace.mjs +0 -13
- package/source/constraints/namespace.mjs +0 -13
- package/source/data/datasource/namespace.mjs +0 -13
- package/source/data/datasource/server/namespace.mjs +0 -13
- package/source/data/datasource/server/restapi/namespace.mjs +0 -13
- package/source/data/datasource/storage/namespace.mjs +0 -13
- package/source/data/namespace.mjs +0 -13
- package/source/dom/namespace.mjs +0 -13
- package/source/dom/resource/link/namespace.mjs +0 -13
- package/source/dom/resource/namespace.mjs +0 -13
- package/source/dom/util/namespace.mjs +0 -13
- package/source/dom/worker/namespace.mjs +0 -13
- package/source/i18n/namespace.mjs +0 -13
- package/source/i18n/providers/namespace.mjs +0 -13
- package/source/logging/handler/namespace.mjs +0 -11
- package/source/logging/namespace.mjs +0 -13
- package/source/math/namespace.mjs +0 -13
- package/source/net/namespace.mjs +0 -13
- package/source/net/webconnect/namespace.mjs +0 -13
- package/source/text/namespace.mjs +0 -13
- package/source/types/namespace.mjs +0 -13
- package/source/util/namespace.mjs +0 -13
- /package/source/components/{host → layout}/style/collapse.pcss +0 -0
- /package/source/components/{host → layout}/style/details.pcss +0 -0
- /package/source/components/{form → layout}/style/popper.pcss +0 -0
package/example/types/queue.mjs
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import {Queue} from '@schukai/monster/source/types/queue.mjs';
|
|
2
|
-
|
|
3
|
-
const queue = new Queue;
|
|
4
|
-
|
|
5
|
-
queue.add(2);
|
|
6
|
-
queue.add(true);
|
|
7
|
-
queue.add("Hello");
|
|
8
|
-
queue.add(4.5);
|
|
9
|
-
|
|
10
|
-
console.log(queue.poll());
|
|
11
|
-
// ↦ 2
|
|
12
|
-
console.log(queue.poll());
|
|
13
|
-
// ↦ true
|
|
14
|
-
console.log(queue.poll());
|
|
15
|
-
// ↦ "Hello"
|
|
16
|
-
console.log(queue.poll());
|
|
17
|
-
// ↦ 4.5
|
|
18
|
-
console.log(queue.poll());
|
|
19
|
-
// ↦ undefined
|
|
20
|
-
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import {TokenList} from '@schukai/monster/source/types/tokenlist.mjs';
|
|
2
|
-
|
|
3
|
-
new TokenList("start middle end").contains('start'); // ↦ true
|
|
4
|
-
new TokenList("start middle end").contains('end'); // ↦ true
|
|
5
|
-
new TokenList("start middle end").contains('xyz'); // ↦ false
|
|
6
|
-
new TokenList("start middle end").contains(['end','start','middle']); // ↦ true
|
|
7
|
-
new TokenList("start middle end").contains(['end','start','xyz']); // ↦ false
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import {TokenList} from '@schukai/monster/source/types/tokenlist.mjs';
|
|
2
|
-
|
|
3
|
-
new TokenList("abc def ghi").toggle("def xyz").toString(); // ↦ "abc ghi xyz"
|
|
4
|
-
new TokenList("abc def ghi").toggle(["abc", "xyz"]).toString(); // ↦ "def ghi xyz"
|
|
5
|
-
new TokenList().toggle(undefined); // ↦ nothing
|
package/example/types/typeof.mjs
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import {Comparator} from '@schukai/monster/source/util/comparator.mjs';
|
|
2
|
-
|
|
3
|
-
console.log(new Comparator().lessThanOrEqual(2, 5))
|
|
4
|
-
// ↦ true
|
|
5
|
-
console.log(new Comparator().greaterThan(4, 2))
|
|
6
|
-
// ↦ true
|
|
7
|
-
console.log(new Comparator().equal(4, 4))
|
|
8
|
-
// ↦ true
|
|
9
|
-
console.log(new Comparator().equal(4, 5))
|
|
10
|
-
// ↦ false
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import {DeadMansSwitch} from '@schukai/monster/source/util/deadmansswitch.mjs';
|
|
2
|
-
|
|
3
|
-
const deadmansswitch = new DeadMansSwitch(100, () => {
|
|
4
|
-
console.log('yeah!')
|
|
5
|
-
// ↦ "yeah!"
|
|
6
|
-
})
|
|
7
|
-
|
|
8
|
-
deadmansswitch.touch(); // from here wait again 100 ms
|
|
9
|
-
deadmansswitch.touch(200); // from here wait 200 ms
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import {Processing} from '@schukai/monster/source/util/processing.mjs';
|
|
2
|
-
|
|
3
|
-
let startTime = +new Date();
|
|
4
|
-
|
|
5
|
-
new Processing((url) => {
|
|
6
|
-
return fetch(url)
|
|
7
|
-
}, (response) => {
|
|
8
|
-
// do something with the response
|
|
9
|
-
console.log(response.status, +new Date() - startTime)
|
|
10
|
-
}, 200, () => {
|
|
11
|
-
// this function is called 200 seconds after fetch is received.
|
|
12
|
-
console.log('finished', +new Date() - startTime)
|
|
13
|
-
return 'done'
|
|
14
|
-
}).run('https://monsterjs.org/assets/world.json').then(r => {
|
|
15
|
-
console.log(r)
|
|
16
|
-
// ↦ "done"
|
|
17
|
-
})
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright 2023 schukai GmbH
|
|
3
|
-
* SPDX-License-Identifier: AGPL-3.0
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Namespace for all datatable related functions.
|
|
8
|
-
*
|
|
9
|
-
* @namespace Monster.Components.Datatable.Datasource
|
|
10
|
-
* @memberOf Monster
|
|
11
|
-
* @author schukai GmbH
|
|
12
|
-
*/
|
|
13
|
-
const ns = {};
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright 2023 schukai GmbH
|
|
3
|
-
* SPDX-License-Identifier: AGPL-3.0
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Namespace for all datatable related functions.
|
|
8
|
-
*
|
|
9
|
-
* @namespace Monster.Components.Datatable.Datatable
|
|
10
|
-
* @memberOf Monster
|
|
11
|
-
* @author schukai GmbH
|
|
12
|
-
*/
|
|
13
|
-
const ns = {};
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright schukai GmbH and contributors 2023. All Rights Reserved.
|
|
3
|
-
* Node module: @schukai/monster
|
|
4
|
-
* This file is licensed under the AGPLv3 License.
|
|
5
|
-
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* @memberOf Monster.Components.Form
|
|
10
|
-
* @event event:monster-datatable-row-added
|
|
11
|
-
* @type {number} index
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* @memberOf Monster.Components.Form
|
|
16
|
-
* @event event:monster-datatable-row-copied
|
|
17
|
-
* @type {number} index
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* @memberOf Monster.Components.Form
|
|
22
|
-
* @event event:monster-datatable-row-removed
|
|
23
|
-
* @type {number} index
|
|
24
|
-
*/
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright 2023 schukai GmbH
|
|
3
|
-
* SPDX-License-Identifier: AGPL-3.0
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Namespace for all datatable related functions.
|
|
8
|
-
*
|
|
9
|
-
* @namespace Monster.Components.Datatable.Filter
|
|
10
|
-
* @memberOf Monster
|
|
11
|
-
* @author schukai GmbH
|
|
12
|
-
*/
|
|
13
|
-
const ns = {};
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright 2023 schukai GmbH
|
|
3
|
-
* SPDX-License-Identifier: AGPL-3.0
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Namespace for all datatable stylesheets.
|
|
8
|
-
*
|
|
9
|
-
* @namespace Monster.Components.Datatable.StyleSheet
|
|
10
|
-
* @memberOf Monster
|
|
11
|
-
* @author schukai GmbH
|
|
12
|
-
*/
|
|
13
|
-
const ns = {};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright schukai GmbH and contributors 2023. All Rights Reserved.
|
|
3
|
-
* Node module: @schukai/monster
|
|
4
|
-
* This file is licensed under the AGPLv3 License.
|
|
5
|
-
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* content fetched event
|
|
12
|
-
*
|
|
13
|
-
* @memberOf Monster.Components
|
|
14
|
-
* @event event:monster-fetched
|
|
15
|
-
* @type {object}
|
|
16
|
-
* @property {string} url loaded uri
|
|
17
|
-
*/
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright schukai GmbH and contributors 2023. All Rights Reserved.
|
|
3
|
-
* Node module: @schukai/monster
|
|
4
|
-
* This file is licensed under the AGPLv3 License.
|
|
5
|
-
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* This event is fired when options are set
|
|
10
|
-
*
|
|
11
|
-
* @memberOf Monster.Components.Form
|
|
12
|
-
* @event event:monster-options-set
|
|
13
|
-
* @type {object}
|
|
14
|
-
* @property {Object[]} options options
|
|
15
|
-
* @property {string} options.value value
|
|
16
|
-
* @property {string} options.label label
|
|
17
|
-
*/
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* This event is fired when something is selected
|
|
21
|
-
*
|
|
22
|
-
* @memberOf Monster.Components.Form
|
|
23
|
-
* @event event:monster-selected
|
|
24
|
-
* @type {object}
|
|
25
|
-
* @property {array|string} selection
|
|
26
|
-
*/
|
|
27
|
-
|
|
28
|
-
/**
|
|
29
|
-
* This event will be fired when something will change
|
|
30
|
-
*
|
|
31
|
-
* @memberOf Monster.Components.Form
|
|
32
|
-
* @event event:monster-change
|
|
33
|
-
* @type {object}
|
|
34
|
-
* @property {string} [type] event type
|
|
35
|
-
* @property {string} [value] the value that was changed
|
|
36
|
-
* @property {boolean} [checked] if it is a boolean value
|
|
37
|
-
*/
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* This event will be fired when a selection is removed
|
|
41
|
-
*
|
|
42
|
-
* @memberOf Monster.Components.Form
|
|
43
|
-
* @event event:monster-selection-removed
|
|
44
|
-
* @type {object}
|
|
45
|
-
* @property {string} [type] event type
|
|
46
|
-
* @property {string} [value] the value that was changed
|
|
47
|
-
*/
|
|
48
|
-
|
|
49
|
-
/**
|
|
50
|
-
* This event will be fired when a selection is cleared
|
|
51
|
-
*
|
|
52
|
-
* @memberOf Monster.Components.Form
|
|
53
|
-
* @event event:monster-selection-cleared
|
|
54
|
-
* @type {object}
|
|
55
|
-
* @property {string} [type] event type
|
|
56
|
-
*/
|
|
57
|
-
|
|
58
|
-
/**
|
|
59
|
-
* This event will be fired if something has changed
|
|
60
|
-
*
|
|
61
|
-
* @memberOf Monster.Components.Form
|
|
62
|
-
* @event event:monster-changed
|
|
63
|
-
* @type {object}
|
|
64
|
-
* @property {string} [type] event type
|
|
65
|
-
* @property {string} [value] the value that was changed
|
|
66
|
-
* @property {boolean} [checked] if it is a boolean value
|
|
67
|
-
**/
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* button clicked event
|
|
71
|
-
*
|
|
72
|
-
* @memberOf Monster.Components.Form
|
|
73
|
-
* @event event:monster-button-clicked
|
|
74
|
-
* @type {object}
|
|
75
|
-
*/
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* content fetched event
|
|
79
|
-
*
|
|
80
|
-
* @memberOf Monster.Components.Form
|
|
81
|
-
* @event event:monster-button-set
|
|
82
|
-
* @type {object}
|
|
83
|
-
*/
|
|
84
|
-
|
|
85
|
-
/**
|
|
86
|
-
* content fetched event
|
|
87
|
-
*
|
|
88
|
-
* @memberOf Monster.Components.Form
|
|
89
|
-
* @event event:monster-api-button-click
|
|
90
|
-
* @type {object}
|
|
91
|
-
*/
|
|
92
|
-
|
|
93
|
-
/**
|
|
94
|
-
* content fetched event
|
|
95
|
-
*
|
|
96
|
-
* @memberOf Monster.Components.Form
|
|
97
|
-
* @event event:monster-api-button-successful
|
|
98
|
-
* @type {object}
|
|
99
|
-
*/
|
|
100
|
-
|
|
101
|
-
/**
|
|
102
|
-
* content fetched event
|
|
103
|
-
*
|
|
104
|
-
* @memberOf Monster.Components.Form
|
|
105
|
-
* @event event:monster-api-button-failed
|
|
106
|
-
* @type {object}
|
|
107
|
-
*/
|
|
108
|
-
|
|
@@ -1,341 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright schukai GmbH and contributors 2023. All Rights Reserved.
|
|
3
|
-
* Node module: @schukai/monster
|
|
4
|
-
* This file is licensed under the AGPLv3 License.
|
|
5
|
-
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
|
|
6
|
-
*/
|
|
7
|
-
import { instanceSymbol } from "../../constants.mjs";
|
|
8
|
-
import { addAttributeToken } from "../../dom/attributes.mjs";
|
|
9
|
-
import {
|
|
10
|
-
ATTRIBUTE_ERRORMESSAGE,
|
|
11
|
-
ATTRIBUTE_ROLE,
|
|
12
|
-
} from "../../dom/constants.mjs";
|
|
13
|
-
import { CustomControl } from "../../dom/customcontrol.mjs";
|
|
14
|
-
import {
|
|
15
|
-
assembleMethodSymbol,
|
|
16
|
-
attributeObserverSymbol,
|
|
17
|
-
registerCustomElement,
|
|
18
|
-
} from "../../dom/customelement.mjs";
|
|
19
|
-
import { findTargetElementFromEvent } from "../../dom/events.mjs";
|
|
20
|
-
import { isFunction } from "../../types/is.mjs";
|
|
21
|
-
import { ATTRIBUTE_BUTTON_CLASS } from "./constants.mjs";
|
|
22
|
-
import { ButtonStyleSheet } from "./stylesheet/button.mjs";
|
|
23
|
-
import { RippleStyleSheet } from "../stylesheet/ripple.mjs";
|
|
24
|
-
import { fireCustomEvent } from "../../dom/events.mjs";
|
|
25
|
-
|
|
26
|
-
export { FormField };
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
/**
|
|
30
|
-
* This CustomControl creates a container for form elements.
|
|
31
|
-
*
|
|
32
|
-
* <img src="./images/form-field.png">
|
|
33
|
-
*
|
|
34
|
-
* You can create this control either by specifying the HTML tag <monster-form-field />` directly in the HTML or using
|
|
35
|
-
* Javascript via the `document.createElement('monster-form-field');` method.
|
|
36
|
-
*
|
|
37
|
-
* ```html
|
|
38
|
-
* <monster-form-field></monster-form-field>
|
|
39
|
-
* ```
|
|
40
|
-
*
|
|
41
|
-
* Or you can create this CustomControl directly in Javascript:
|
|
42
|
-
*
|
|
43
|
-
* ```js
|
|
44
|
-
* import {Button} from '@schukai/monster/components/form/form-field.mjs';
|
|
45
|
-
* document.createElement('monster-form-field');
|
|
46
|
-
* ```
|
|
47
|
-
*
|
|
48
|
-
* The `data-monster-button-class` attribute can be used to change the CSS class of the button.
|
|
49
|
-
*
|
|
50
|
-
* @startuml form-field.png
|
|
51
|
-
* skinparam monochrome true
|
|
52
|
-
* skinparam shadowing false
|
|
53
|
-
* HTMLElement <|-- CustomElement
|
|
54
|
-
* CustomElement <|-- CustomControl
|
|
55
|
-
* CustomControl <|-- FormField
|
|
56
|
-
* @enduml
|
|
57
|
-
*
|
|
58
|
-
* @since 1.5.0
|
|
59
|
-
* @copyright schukai GmbH
|
|
60
|
-
* @memberOf Monster.Components.Form
|
|
61
|
-
* @summary A simple button
|
|
62
|
-
*/
|
|
63
|
-
class FormField extends CustomControl {
|
|
64
|
-
/**
|
|
65
|
-
* This method is called by the `instanceof` operator.
|
|
66
|
-
* @returns {symbol}
|
|
67
|
-
* @since 2.1.0
|
|
68
|
-
*/
|
|
69
|
-
static get [instanceSymbol]() {
|
|
70
|
-
return Symbol.for("@schukai/monster/components/form/button@@instance");
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
*
|
|
75
|
-
* @return {Monster.Components.Form.Button}
|
|
76
|
-
*/
|
|
77
|
-
[assembleMethodSymbol]() {
|
|
78
|
-
super[assembleMethodSymbol]();
|
|
79
|
-
initControlReferences.call(this);
|
|
80
|
-
initEventHandler.call(this);
|
|
81
|
-
return this;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* The Button.click() method simulates a click on the internal button element.
|
|
86
|
-
*
|
|
87
|
-
* @since 3.27.0
|
|
88
|
-
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click}
|
|
89
|
-
*/
|
|
90
|
-
click() {
|
|
91
|
-
if (this.getOption("disabled") === true) {
|
|
92
|
-
return;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
if (
|
|
96
|
-
this[buttonElementSymbol] &&
|
|
97
|
-
isFunction(this[buttonElementSymbol].click)
|
|
98
|
-
) {
|
|
99
|
-
this[buttonElementSymbol].click();
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
/**
|
|
104
|
-
* The Button.focus() method sets focus on the internal button element.
|
|
105
|
-
*
|
|
106
|
-
* @since 3.27.0
|
|
107
|
-
* @param {Object} options
|
|
108
|
-
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus}
|
|
109
|
-
*/
|
|
110
|
-
focus(options) {
|
|
111
|
-
if (this.getOption("disabled") === true) {
|
|
112
|
-
return;
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
if (
|
|
116
|
-
this[buttonElementSymbol] &&
|
|
117
|
-
isFunction(this[buttonElementSymbol].focus)
|
|
118
|
-
) {
|
|
119
|
-
this[buttonElementSymbol].focus(options);
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
/**
|
|
124
|
-
* The Button.blur() method removes focus from the internal button element.
|
|
125
|
-
*/
|
|
126
|
-
blur() {
|
|
127
|
-
if (
|
|
128
|
-
this[buttonElementSymbol] &&
|
|
129
|
-
isFunction(this[buttonElementSymbol].blur)
|
|
130
|
-
) {
|
|
131
|
-
this[buttonElementSymbol].blur();
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
/**
|
|
136
|
-
* This method determines which attributes are to be monitored by `attributeChangedCallback()`.
|
|
137
|
-
*
|
|
138
|
-
* @return {string[]}
|
|
139
|
-
*/
|
|
140
|
-
static get observedAttributes() {
|
|
141
|
-
const attributes = super.observedAttributes;
|
|
142
|
-
attributes.push(ATTRIBUTE_BUTTON_CLASS);
|
|
143
|
-
return attributes;
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
/**
|
|
147
|
-
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals}
|
|
148
|
-
* @return {boolean}
|
|
149
|
-
*/
|
|
150
|
-
static get formAssociated() {
|
|
151
|
-
return true;
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
/**
|
|
155
|
-
* The current selection of the Select
|
|
156
|
-
*
|
|
157
|
-
* ```
|
|
158
|
-
* e = document.querySelector('monster-select');
|
|
159
|
-
* console.log(e.value)
|
|
160
|
-
* // ↦ 1
|
|
161
|
-
* // ↦ ['1','2']
|
|
162
|
-
* ```
|
|
163
|
-
*
|
|
164
|
-
* @property {string|array}
|
|
165
|
-
*/
|
|
166
|
-
get value() {
|
|
167
|
-
return this.getOption("value");
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
/**
|
|
171
|
-
* Set selection
|
|
172
|
-
*
|
|
173
|
-
* ```
|
|
174
|
-
* e = document.querySelector('monster-select');
|
|
175
|
-
* e.value=1
|
|
176
|
-
* ```
|
|
177
|
-
*
|
|
178
|
-
* @property {string|array} value
|
|
179
|
-
* @since 1.2.0
|
|
180
|
-
* @throws {Error} unsupported type
|
|
181
|
-
*/
|
|
182
|
-
set value(value) {
|
|
183
|
-
this.setOption("value", value);
|
|
184
|
-
try {
|
|
185
|
-
this?.setFormValue(this.value);
|
|
186
|
-
} catch (e) {
|
|
187
|
-
addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, e.message);
|
|
188
|
-
}
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
/**
|
|
192
|
-
* To set the options via the html tag the attribute `data-monster-options` must be used.
|
|
193
|
-
* @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
|
|
194
|
-
*
|
|
195
|
-
* The individual configuration values can be found in the table.
|
|
196
|
-
*
|
|
197
|
-
* @property {Object} templates Template definitions
|
|
198
|
-
* @property {string} templates.main Main template
|
|
199
|
-
* @property {Object} labels Labels
|
|
200
|
-
* @property {string} labels.button=<slot></slot> Button label
|
|
201
|
-
* @property {Object} actions Callbacks
|
|
202
|
-
* @property {string} actions.click="throw Error" Callback when clicked
|
|
203
|
-
* @property {Object} classes CSS classes
|
|
204
|
-
* @property {string} classes.button="monster-button-primary" CSS class for the button
|
|
205
|
-
* @property {boolean} disabled=false Disabled state
|
|
206
|
-
* @property {Object} effects Effects
|
|
207
|
-
* @property {boolean} effects.ripple=true Ripple effect
|
|
208
|
-
*/
|
|
209
|
-
get defaults() {
|
|
210
|
-
return Object.assign({}, super.defaults, {
|
|
211
|
-
templates: {
|
|
212
|
-
main: getTemplate(),
|
|
213
|
-
},
|
|
214
|
-
labels: {
|
|
215
|
-
button: "<slot></slot>",
|
|
216
|
-
},
|
|
217
|
-
classes: {
|
|
218
|
-
button: "monster-button-primary",
|
|
219
|
-
},
|
|
220
|
-
disabled: false,
|
|
221
|
-
actions: {
|
|
222
|
-
click: () => {
|
|
223
|
-
throw new Error("the click action is not defined");
|
|
224
|
-
},
|
|
225
|
-
},
|
|
226
|
-
effects: {
|
|
227
|
-
ripple: true,
|
|
228
|
-
},
|
|
229
|
-
value: null,
|
|
230
|
-
});
|
|
231
|
-
}
|
|
232
|
-
|
|
233
|
-
/**
|
|
234
|
-
*
|
|
235
|
-
* @return {string}
|
|
236
|
-
*/
|
|
237
|
-
static getTag() {
|
|
238
|
-
return "monster-form-field";
|
|
239
|
-
}
|
|
240
|
-
|
|
241
|
-
/**
|
|
242
|
-
*
|
|
243
|
-
* @return {Array<CSSStyleSheet>}
|
|
244
|
-
*/
|
|
245
|
-
static getCSSStyleSheet() {
|
|
246
|
-
return [FormFieldStyleSheet];
|
|
247
|
-
}
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
/**
|
|
251
|
-
* @private
|
|
252
|
-
* @return {initEventHandler}
|
|
253
|
-
* @fires Monster.Components.Form.event:monster-button-clicked
|
|
254
|
-
*/
|
|
255
|
-
function initEventHandler() {
|
|
256
|
-
const self = this;
|
|
257
|
-
const button = this[buttonElementSymbol];
|
|
258
|
-
|
|
259
|
-
const type = "click";
|
|
260
|
-
|
|
261
|
-
button.addEventListener(type, function (event) {
|
|
262
|
-
const callback = self.getOption("actions.click");
|
|
263
|
-
|
|
264
|
-
fireCustomEvent(self, "monster-button-clicked", {
|
|
265
|
-
button: self,
|
|
266
|
-
});
|
|
267
|
-
|
|
268
|
-
if (!isFunction(callback)) {
|
|
269
|
-
return;
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
const element = findTargetElementFromEvent(
|
|
273
|
-
event,
|
|
274
|
-
ATTRIBUTE_ROLE,
|
|
275
|
-
"control",
|
|
276
|
-
);
|
|
277
|
-
|
|
278
|
-
if (!(element instanceof Node && self.hasNode(element))) {
|
|
279
|
-
return;
|
|
280
|
-
}
|
|
281
|
-
|
|
282
|
-
callback.call(self, event);
|
|
283
|
-
});
|
|
284
|
-
|
|
285
|
-
if (self.getOption("effects.ripple")) {
|
|
286
|
-
button.addEventListener("click", createRipple.bind(self));
|
|
287
|
-
}
|
|
288
|
-
|
|
289
|
-
// data-monster-options
|
|
290
|
-
self[attributeObserverSymbol][ATTRIBUTE_BUTTON_CLASS] = function (value) {
|
|
291
|
-
self.setOption("classes.button", value);
|
|
292
|
-
};
|
|
293
|
-
|
|
294
|
-
return this;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
|
-
/**
|
|
298
|
-
* @private
|
|
299
|
-
*/
|
|
300
|
-
function initControlReferences() {
|
|
301
|
-
this[buttonElementSymbol] = this.shadowRoot.querySelector(
|
|
302
|
-
`[${ATTRIBUTE_ROLE}=button]`,
|
|
303
|
-
);
|
|
304
|
-
}
|
|
305
|
-
|
|
306
|
-
/**
|
|
307
|
-
* @private
|
|
308
|
-
* @return {string}
|
|
309
|
-
*/
|
|
310
|
-
function getTemplate() {
|
|
311
|
-
// language=HTML
|
|
312
|
-
return `
|
|
313
|
-
<div data-monster-role="control" part="control">
|
|
314
|
-
<button data-monster-attributes="disabled path:disabled | if:true, class path:classes.button"
|
|
315
|
-
data-monster-role="button"
|
|
316
|
-
part="button"
|
|
317
|
-
data-monster-replace="path:labels.button"></button>
|
|
318
|
-
</div>`;
|
|
319
|
-
}
|
|
320
|
-
|
|
321
|
-
function createRipple(event) {
|
|
322
|
-
const button = this[buttonElementSymbol];
|
|
323
|
-
|
|
324
|
-
const circle = document.createElement("span");
|
|
325
|
-
const diameter = Math.max(button.clientWidth, button.clientHeight);
|
|
326
|
-
const radius = diameter / 2;
|
|
327
|
-
|
|
328
|
-
circle.style.width = circle.style.height = `${diameter}px`;
|
|
329
|
-
circle.style.left = `${event.clientX - button.offsetLeft - radius}px`;
|
|
330
|
-
circle.style.top = `${event.clientY - button.offsetTop - radius}px`;
|
|
331
|
-
circle.classList.add("monster-fx-ripple");
|
|
332
|
-
|
|
333
|
-
const ripples = button.getElementsByClassName("monster-fx-ripple");
|
|
334
|
-
for (const ripple of ripples) {
|
|
335
|
-
ripple.remove();
|
|
336
|
-
}
|
|
337
|
-
|
|
338
|
-
button.appendChild(circle);
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
registerCustomElement(FormField);
|