@wavemaker-ai/app-ng-runtime 1.0.0-rc.309

package/components/input/checkboxset/fesm2022/index.mjs

@@ -0,0 +1,165 @@
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { HostListener, Inject, Optional, Component } from '@angular/core';
+import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
+import { FormWidgetType, setListClass } from '@wm/core';
+import { PROP_STRING, PROP_BOOLEAN, PROP_ANY, PROP_NUMBER, register, registerFormWidget, styler, TextContentDirective, ItemTemplateDirective, PartialParamHandlerDirective, PartialContainerDirective, provideAs, provideAsWidgetRef } from '@wm/components/base';
+import { DatasetAwareFormComponent } from '@wm/components/input/dataset-aware-form';
+import { forEach, includes } from 'lodash-es';
+
+const checkboxsetProps = new Map([
+    ['class', PROP_STRING],
+    ['collapsible', PROP_BOOLEAN],
+    ['compareby', PROP_STRING],
+    ['datafield', PROP_STRING],
+    ['dataset', { value: 'Option 1, Option 2, Option 3', ...PROP_ANY }],
+    ['datavaluesource', PROP_ANY],
+    ['datavalue', PROP_STRING],
+    ['dateformat', PROP_STRING],
+    ['disabled', PROP_BOOLEAN],
+    ['displayexpression', PROP_STRING],
+    ['displayfield', PROP_STRING],
+    ['displayValue', PROP_STRING],
+    ['groupby', PROP_STRING],
+    ['itemclass', { value: '', ...PROP_STRING }],
+    ['itemsperrow', { value: 'xs-1 sm-1 md-1 lg-1', ...PROP_STRING }],
+    ['listclass', { value: '', ...PROP_STRING }],
+    ['match', PROP_STRING],
+    ['name', PROP_STRING],
+    ['orderby', PROP_STRING],
+    ['readonly', PROP_BOOLEAN],
+    ['required', PROP_BOOLEAN],
+    ['show', { value: true, ...PROP_BOOLEAN }],
+    ['showcount', PROP_BOOLEAN],
+    ['showindevice', { displayType: 'inline-block', value: 'all', ...PROP_STRING }],
+    ['tabindex', { value: 0, ...PROP_NUMBER }],
+    ['usekeys', PROP_BOOLEAN],
+    ['layout', PROP_STRING]
+]);
+const registerProps = () => {
+    register('wm-checkboxset', checkboxsetProps);
+    registerFormWidget(FormWidgetType.CHECKBOXSET, new Map(checkboxsetProps));
+};
+
+const DEFAULT_CLS = 'app-checkboxset list-group inline';
+const WIDGET_CONFIG = { widgetType: 'wm-checkboxset', hostClass: DEFAULT_CLS };
+class CheckboxsetComponent extends DatasetAwareFormComponent {
+    static { this.initializeProps = registerProps(); }
+    constructor(inj, explicitContext) {
+        super(inj, WIDGET_CONFIG, explicitContext);
+        this.layout = '';
+        this.eventListeners = new Map();
+        styler(this.nativeElement, this);
+        this.multiple = true;
+    }
+    triggerInvokeOnChange(keys, $event) {
+        this.modelByKey = keys;
+        if (this.viewParent.containerWidget && this.viewParent.containerWidget.updateDataValue)
+            this.viewParent.containerWidget.updateDataValue(this.datavalue);
+        this.invokeOnTouched();
+        // invoke on datavalue change.
+        this.invokeOnChange(this.datavalue, $event || {}, true);
+    }
+    onCheckboxLabelClick($event, key) {
+        if (!$($event.target).is('input')) {
+            return;
+        }
+        // construct the _model from the checked elements.
+        const inputElements = this.nativeElement.querySelectorAll('input:checked');
+        const keys = [];
+        forEach(inputElements, ($el) => {
+            // @ts-ignore
+            keys.push($el.value);
+        });
+        this.triggerInvokeOnChange(keys, $event);
+    }
+    // change and blur events are added from the template
+    handleEvent(node, eventName, callback, locals) {
+        if (eventName === 'click') {
+            const handler = (e) => {
+                if (!$(e.target).is('input')) {
+                    return;
+                }
+                locals.$event = e;
+                return callback();
+            };
+            const deregister = this.eventManager.addEventListener(node, eventName, handler);
+            this.eventListeners.set(node, deregister);
+        }
+        else if (!includes(['change'], eventName)) {
+            super.handleEvent(node, eventName, callback, locals);
+        }
+    }
+    onKeyDown($event) {
+        $event.preventDefault();
+        $event.target.click();
+    }
+    onPropertyChange(key, nv, ov) {
+        if (key === 'tabindex') {
+            return;
+        }
+        if (key === 'required') {
+            this._onChange(this.datavalue);
+            return;
+        }
+        else if (key === 'layout') {
+            this.handleLayout(nv);
+        }
+        if (key === 'itemsperrow') {
+            setListClass(this);
+        }
+        else {
+            super.onPropertyChange(key, nv, ov);
+        }
+    }
+    handleLayout(layout) {
+        const direction = layout === 'vertical' ? 'column' : 'row';
+        this.$element.css({
+            display: 'flex',
+            flexDirection: direction
+        });
+    }
+    ngOnDestroy() {
+        // MEMORY LEAK FIX: Remove all event listeners
+        if (this.eventListeners && this.eventListeners.size > 0) {
+            this.eventListeners.forEach((deregister) => {
+                if (deregister && typeof deregister === 'function') {
+                    deregister();
+                }
+            });
+            this.eventListeners.clear();
+            this.eventListeners = null;
+        }
+        super.ngOnDestroy();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CheckboxsetComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: CheckboxsetComponent, isStandalone: true, selector: "[wmCheckboxset]", host: { listeners: { "keydown.enter": "onKeyDown($event,\"ENTER\")" } }, providers: [
+            provideAs(CheckboxsetComponent, NG_VALUE_ACCESSOR, true),
+            provideAs(CheckboxsetComponent, NG_VALIDATORS, true),
+            provideAsWidgetRef(CheckboxsetComponent)
+        ], exportAs: ["wmCheckboxset"], usesInheritance: true, ngImport: i0, template: "@if (!groupby) {\n  @for (item of datasetItems; track item; let i = $index) {\n    <li [ngClass]=\"['checkbox', 'app-checkbox', itemclass, itemsPerRowClass]\"\n      [class.active]=\"item.selected\"\n      [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n      (click)=\"onCheckboxLabelClick($event, item.key)\" role=\"presentation\">\n      <!-- Default item template -->\n      @if (!content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption\" [textContent]=\"item.label\"></span>\n        </label>\n      }\n      <!-- Custom partial template -->\n      @if (content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption customTemplate\" partial-container-target></span>\n        </label>\n      }\n    </li>\n  }\n} @else {\n  @for (groupObj of groupedData; track groupObj; let groupindex = $index) {\n    <li class=\"app-list-item-group\" role=\"presentation\">\n      <ul class=\"item-group\" [attr.aria-labelledby]=\"'group_' + widgetId + '_' + groupindex\">\n        <li [id]=\"'group_' + widgetId + '_' + groupindex\" aria-hidden=\"true\" class=\"list-group-header\" (click)=\"handleHeaderClick($event)\" [title]=\"groupObj.key\" [ngClass]=\"{'collapsible-content': collapsible}\">\n          <h4 class=\"group-title\" [attr.aria-label]=\"'Group '+groupObj.key\">{{groupObj.key}}\n            <div class=\"header-action\">\n              @if (collapsible) {\n                <i class=\"app-icon wi action wi-chevron-up\" title=\"{{appLocale.LABEL_COLLAPSE}}/{{appLocale.LABEL_EXPAND}}\"></i>\n              }\n              @if (showcount) {\n                <span class=\"label label-default\" [textContent]=\"groupObj.data.length\"></span>\n              }\n            </div>\n          </h4>\n        </li>\n        @for (item of groupObj.data; track item; let i = $index) {\n          <li\n            [ngClass]=\"['checkbox', 'app-checkbox', 'group-list-item', itemclass, itemsPerRowClass]\"\n            [class.active]=\"item.selected\"\n            [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n            (click)=\"onCheckboxLabelClick($event, item)\">\n            <!-- Default item template -->\n            @if (!content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" [textContent]=\"item.label\"></span>\n              </label>\n            }\n            <!-- Custom partial template -->\n            @if (content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" partial-container-target></span>\n              </label>\n            }\n          </li>\n        }\n      </ul>\n    </li>\n  }\n}\n<input [disabled]=\"disabled || readonly\" hidden class=\"model-holder\">\n@if (readonly || disabled) {\n  <div class=\"readonly-wrapper\"></div>\n}\n\n<!-- This template will be displayed when groupby is specified. -->\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "directive", type: ItemTemplateDirective, selector: "[wmItemTemplate]", inputs: ["userComponentParams", "wmItemTemplate"], exportAs: ["itemTemplateRef"] }, { kind: "directive", type: PartialParamHandlerDirective, selector: "[partialContainer]" }, { kind: "directive", type: PartialContainerDirective, selector: "[partialContainer]" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CheckboxsetComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, imports: [CommonModule, TextContentDirective, ItemTemplateDirective, PartialParamHandlerDirective, PartialContainerDirective], selector: '[wmCheckboxset]', exportAs: 'wmCheckboxset', providers: [
+                        provideAs(CheckboxsetComponent, NG_VALUE_ACCESSOR, true),
+                        provideAs(CheckboxsetComponent, NG_VALIDATORS, true),
+                        provideAsWidgetRef(CheckboxsetComponent)
+                    ], template: "@if (!groupby) {\n  @for (item of datasetItems; track item; let i = $index) {\n    <li [ngClass]=\"['checkbox', 'app-checkbox', itemclass, itemsPerRowClass]\"\n      [class.active]=\"item.selected\"\n      [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n      (click)=\"onCheckboxLabelClick($event, item.key)\" role=\"presentation\">\n      <!-- Default item template -->\n      @if (!content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption\" [textContent]=\"item.label\"></span>\n        </label>\n      }\n      <!-- Custom partial template -->\n      @if (content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption customTemplate\" partial-container-target></span>\n        </label>\n      }\n    </li>\n  }\n} @else {\n  @for (groupObj of groupedData; track groupObj; let groupindex = $index) {\n    <li class=\"app-list-item-group\" role=\"presentation\">\n      <ul class=\"item-group\" [attr.aria-labelledby]=\"'group_' + widgetId + '_' + groupindex\">\n        <li [id]=\"'group_' + widgetId + '_' + groupindex\" aria-hidden=\"true\" class=\"list-group-header\" (click)=\"handleHeaderClick($event)\" [title]=\"groupObj.key\" [ngClass]=\"{'collapsible-content': collapsible}\">\n          <h4 class=\"group-title\" [attr.aria-label]=\"'Group '+groupObj.key\">{{groupObj.key}}\n            <div class=\"header-action\">\n              @if (collapsible) {\n                <i class=\"app-icon wi action wi-chevron-up\" title=\"{{appLocale.LABEL_COLLAPSE}}/{{appLocale.LABEL_EXPAND}}\"></i>\n              }\n              @if (showcount) {\n                <span class=\"label label-default\" [textContent]=\"groupObj.data.length\"></span>\n              }\n            </div>\n          </h4>\n        </li>\n        @for (item of groupObj.data; track item; let i = $index) {\n          <li\n            [ngClass]=\"['checkbox', 'app-checkbox', 'group-list-item', itemclass, itemsPerRowClass]\"\n            [class.active]=\"item.selected\"\n            [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n            (click)=\"onCheckboxLabelClick($event, item)\">\n            <!-- Default item template -->\n            @if (!content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" [textContent]=\"item.label\"></span>\n              </label>\n            }\n            <!-- Custom partial template -->\n            @if (content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" partial-container-target></span>\n              </label>\n            }\n          </li>\n        }\n      </ul>\n    </li>\n  }\n}\n<input [disabled]=\"disabled || readonly\" hidden class=\"model-holder\">\n@if (readonly || disabled) {\n  <div class=\"readonly-wrapper\"></div>\n}\n\n<!-- This template will be displayed when groupby is specified. -->\n" }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: ['EXPLICIT_CONTEXT']
+                }, {
+                    type: Optional
+                }] }], propDecorators: { onKeyDown: [{
+                type: HostListener,
+                args: ['keydown.enter', ['$event', '"ENTER"']]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CheckboxsetComponent };
+//# sourceMappingURL=index.mjs.map

package/components/input/checkboxset/fesm2022/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../projects/components/widgets/input/checkboxset/src/checkboxset.props.ts","../../../../../projects/components/widgets/input/checkboxset/src/checkboxset.component.ts","../../../../../projects/components/widgets/input/checkboxset/src/checkboxset.component.html","../../../../../projects/components/widgets/input/checkboxset/src/index.ts"],"sourcesContent":["import { FormWidgetType } from '@wm/core';\nimport { PROP_ANY, PROP_BOOLEAN, PROP_NUMBER, PROP_STRING, register, registerFormWidget } from '@wm/components/base';\n\nexport const checkboxsetProps = new Map(\n    [\n        ['class', PROP_STRING],\n        ['collapsible', PROP_BOOLEAN],\n        ['compareby', PROP_STRING],\n        ['datafield', PROP_STRING],\n        ['dataset', {value: 'Option 1, Option 2, Option 3', ...PROP_ANY}],\n        ['datavaluesource', PROP_ANY],\n        ['datavalue', PROP_STRING],\n        ['dateformat', PROP_STRING],\n        ['disabled', PROP_BOOLEAN],\n        ['displayexpression', PROP_STRING],\n        ['displayfield', PROP_STRING],\n        ['displayValue', PROP_STRING],\n        ['groupby', PROP_STRING],\n        ['itemclass', {value: '', ...PROP_STRING}],\n        ['itemsperrow', {value: 'xs-1 sm-1 md-1 lg-1', ...PROP_STRING}],\n        ['listclass', {value: '', ...PROP_STRING}],\n        ['match', PROP_STRING],\n        ['name', PROP_STRING],\n        ['orderby', PROP_STRING],\n        ['readonly', PROP_BOOLEAN],\n        ['required', PROP_BOOLEAN],\n        ['show', {value: true, ...PROP_BOOLEAN}],\n        ['showcount', PROP_BOOLEAN],\n        ['showindevice', {displayType: 'inline-block', value: 'all', ...PROP_STRING}],\n        ['tabindex', {value: 0, ...PROP_NUMBER}],\n        ['usekeys', PROP_BOOLEAN],\n        ['layout', PROP_STRING]\n    ]\n);\n\nexport const registerProps = () => {\n    register(\n        'wm-checkboxset',\n        checkboxsetProps\n    );\n    registerFormWidget(\n        FormWidgetType.CHECKBOXSET,\n        new Map(checkboxsetProps)\n    );\n};\n","import { CommonModule } from '@angular/common';\nimport {Component, HostListener, Inject, Injector, OnDestroy, Optional} from '@angular/core';\nimport { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';\n\nimport {setListClass} from '@wm/core';\nimport { ItemTemplateDirective, IWidgetConfig, PartialContainerDirective, PartialParamHandlerDirective, provideAs, provideAsWidgetRef, styler, TextContentDirective } from '@wm/components/base';\nimport { DatasetAwareFormComponent } from '@wm/components/input/dataset-aware-form';\n\nimport { registerProps } from './checkboxset.props';\nimport {forEach, includes} from \"lodash-es\";\n\ndeclare const $;\n\nconst DEFAULT_CLS = 'app-checkboxset list-group inline';\nconst WIDGET_CONFIG: IWidgetConfig = {widgetType: 'wm-checkboxset', hostClass: DEFAULT_CLS};\n\n@Component({\n    standalone: true,\n    imports: [CommonModule, TextContentDirective, ItemTemplateDirective, PartialParamHandlerDirective, PartialContainerDirective],\n    selector: '[wmCheckboxset]',\n    exportAs: 'wmCheckboxset',\n    templateUrl: 'checkboxset.component.html',\n    providers: [\n        provideAs(CheckboxsetComponent, NG_VALUE_ACCESSOR, true),\n        provideAs(CheckboxsetComponent, NG_VALIDATORS, true),\n        provideAsWidgetRef(CheckboxsetComponent)\n    ]\n})\n\nexport class CheckboxsetComponent extends DatasetAwareFormComponent implements OnDestroy {\n    static initializeProps = registerProps();\n\n    public layout = '';\n    public collapsible: boolean;\n\n    protected match: string;\n    protected dateformat: string;\n\n    public disabled: boolean;\n    public itemsperrow: string;\n    private itemsPerRowClass: string;\n\n    constructor(inj: Injector, @Inject('EXPLICIT_CONTEXT') @Optional() explicitContext: any) {\n        super(inj, WIDGET_CONFIG, explicitContext);\n        styler(this.nativeElement, this);\n        this.multiple = true;\n    }\n\n    triggerInvokeOnChange(keys, $event) {\n        this.modelByKey = keys;\n\n        if(this.viewParent.containerWidget && this.viewParent.containerWidget.updateDataValue)\n            this.viewParent.containerWidget.updateDataValue(this.datavalue);\n\n        this.invokeOnTouched();\n        // invoke on datavalue change.\n        this.invokeOnChange(this.datavalue, $event || {}, true);\n    }\n\n    onCheckboxLabelClick($event, key) {\n        if (!$($event.target).is('input')) {\n            return;\n        }\n\n        // construct the _model from the checked elements.\n        const inputElements = this.nativeElement.querySelectorAll('input:checked');\n        const keys = [];\n        forEach(inputElements, ($el) => {\n            // @ts-ignore\n            keys.push($el.value);\n        });\n\n        this.triggerInvokeOnChange(keys, $event);\n    }\n\n    private eventListeners: Map<HTMLElement, Function> = new Map();\n\n    // change and blur events are added from the template\n    protected handleEvent(node: HTMLElement, eventName: string, callback: Function, locals: any) {\n        if (eventName === 'click') {\n            const handler = (e) => {\n                if (!$(e.target).is('input')) {\n                    return;\n                }\n                locals.$event = e;\n                return callback();\n            };\n            \n            const deregister = this.eventManager.addEventListener(node, eventName, handler);\n            this.eventListeners.set(node, deregister);\n        } else if (!includes(['change'], eventName)) {\n            super.handleEvent(node, eventName, callback, locals);\n        }\n    }\n\n    @HostListener('keydown.enter', ['$event', '\"ENTER\"'])\n    onKeyDown($event) {\n        $event.preventDefault();\n        $event.target.click();\n    }\n\n    onPropertyChange(key, nv, ov?) {\n\n        if (key === 'tabindex') {\n            return;\n        }\n        if (key === 'required') {\n            this._onChange(this.datavalue);\n            return;\n        }else if(key === 'layout'){\n            this.handleLayout(nv)\n        }\n        if (key === 'itemsperrow') {\n            setListClass(this);\n        } else {\n            super.onPropertyChange(key, nv, ov);\n        }\n    }\n    handleLayout(layout: string) {\n        const direction = layout === 'vertical' ? 'column' : 'row';\n        this.$element.css({\n            display: 'flex',\n            flexDirection: direction\n        });\n    }\n\n\n    ngOnDestroy() {\n        // MEMORY LEAK FIX: Remove all event listeners\n        if (this.eventListeners && this.eventListeners.size > 0) {\n            this.eventListeners.forEach((deregister) => {\n                if (deregister && typeof deregister === 'function') {\n                    deregister();\n                }\n            });\n            this.eventListeners.clear();\n            this.eventListeners = null;\n        }\n\n        super.ngOnDestroy();\n    }\n}\n","@if (!groupby) {\n  @for (item of datasetItems; track item; let i = $index) {\n    <li [ngClass]=\"['checkbox', 'app-checkbox', itemclass, itemsPerRowClass]\"\n      [class.active]=\"item.selected\"\n      [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n      (click)=\"onCheckboxLabelClick($event, item.key)\" role=\"presentation\">\n      <!-- Default item template -->\n      @if (!content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption\" [textContent]=\"item.label\"></span>\n        </label>\n      }\n      <!-- Custom partial template -->\n      @if (content) {\n        <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n          <input [name]=\"'checkboxset_' + widgetId\" [tabindex]=\"tabindex\"\n            type=\"checkbox\"\n            [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n            [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n          <span class=\"caption customTemplate\" partial-container-target></span>\n        </label>\n      }\n    </li>\n  }\n} @else {\n  @for (groupObj of groupedData; track groupObj; let groupindex = $index) {\n    <li class=\"app-list-item-group\" role=\"presentation\">\n      <ul class=\"item-group\" [attr.aria-labelledby]=\"'group_' + widgetId + '_' + groupindex\">\n        <li [id]=\"'group_' + widgetId + '_' + groupindex\" aria-hidden=\"true\" class=\"list-group-header\" (click)=\"handleHeaderClick($event)\" [title]=\"groupObj.key\" [ngClass]=\"{'collapsible-content': collapsible}\">\n          <h4 class=\"group-title\" [attr.aria-label]=\"'Group '+groupObj.key\">{{groupObj.key}}\n            <div class=\"header-action\">\n              @if (collapsible) {\n                <i class=\"app-icon wi action wi-chevron-up\" title=\"{{appLocale.LABEL_COLLAPSE}}/{{appLocale.LABEL_EXPAND}}\"></i>\n              }\n              @if (showcount) {\n                <span class=\"label label-default\" [textContent]=\"groupObj.data.length\"></span>\n              }\n            </div>\n          </h4>\n        </li>\n        @for (item of groupObj.data; track item; let i = $index) {\n          <li\n            [ngClass]=\"['checkbox', 'app-checkbox', 'group-list-item', itemclass, itemsPerRowClass]\"\n            [class.active]=\"item.selected\"\n            [wmItemTemplate]=\"content\" [userComponentParams]=\"item\" partialContainer\n            (click)=\"onCheckboxLabelClick($event, item)\">\n            <!-- Default item template -->\n            @if (!content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" [title]=\"item.label\">\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" [textContent]=\"item.label\"></span>\n              </label>\n            }\n            <!-- Custom partial template -->\n            @if (content) {\n              <label class=\"app-checkboxset-label\" [ngClass]=\"{'disabled':disabled || readonly}\" >\n                <input [name]=\"'checkboxset_' + widgetId\" type=\"checkbox\"\n                  [tabindex]=\"tabindex\"\n                  [disabled]=\"disabled || readonly\" [attr.data-attr-index]=\"i\"\n                  [value]=\"item.key\" [tabindex]=\"tabindex\" [checked]=\"item.selected\"/>\n                <span class=\"caption\" partial-container-target></span>\n              </label>\n            }\n          </li>\n        }\n      </ul>\n    </li>\n  }\n}\n<input [disabled]=\"disabled || readonly\" hidden class=\"model-holder\">\n@if (readonly || disabled) {\n  <div class=\"readonly-wrapper\"></div>\n}\n\n<!-- This template will be displayed when groupby is specified. -->\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/components/input/checkboxset/index.d.ts

@@ -0,0 +1,27 @@
+import * as i0 from '@angular/core';
+import { OnDestroy, Injector } from '@angular/core';
+import { DatasetAwareFormComponent } from '@wm/components/input/dataset-aware-form';
+
+declare class CheckboxsetComponent extends DatasetAwareFormComponent implements OnDestroy {
+    static initializeProps: void;
+    layout: string;
+    collapsible: boolean;
+    protected match: string;
+    protected dateformat: string;
+    disabled: boolean;
+    itemsperrow: string;
+    private itemsPerRowClass;
+    constructor(inj: Injector, explicitContext: any);
+    triggerInvokeOnChange(keys: any, $event: any): void;
+    onCheckboxLabelClick($event: any, key: any): void;
+    private eventListeners;
+    protected handleEvent(node: HTMLElement, eventName: string, callback: Function, locals: any): void;
+    onKeyDown($event: any): void;
+    onPropertyChange(key: any, nv: any, ov?: any): void;
+    handleLayout(layout: string): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxsetComponent, [null, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxsetComponent, "[wmCheckboxset]", ["wmCheckboxset"], {}, {}, never, never, true, never>;
+}
+
+export { CheckboxsetComponent };

package/components/input/checkboxset/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "@wm/components/input/checkboxset",
+  "sideEffects": false,
+  "dependencies": {
+    "tslib": "^2.0.0"
+  },
+  "module": "fesm2022/index.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./fesm2022/index.mjs"
+    }
+  }
+}

package/components/input/chips/.npmignore

@@ -0,0 +1,2 @@
+# Nested package.json's are only needed for development.
+**/package.json