npm - @infineon/infineon-design-system-stencil - Versions diffs - 30.9.3--canary.1640.cca6b3e0f7f750f15c51f9cb6eb2c66789549fb3.0 → 30.9.3--canary.1680.63ee9527ec4620c707f0c9846a009da9e4c52d97.0 - Mend

@infineon/infineon-design-system-stencil 30.9.3--canary.1640.cca6b3e0f7f750f15c51f9cb6eb2c66789549fb3.0 → 30.9.3--canary.1680.63ee9527ec4620c707f0c9846a009da9e4c52d97.0

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 (952) hide show

package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js CHANGED Viewed

@@ -3,10 +3,6 @@ import { getInitiallySelectedItems } from "../utils";
 export class FilterAccordion {
     constructor() {
         this.initialized = false;
-        this.expanded = false;
-        this.count = 0;
-        this.totalItems = 0;
-        this.filterGroupName = "";
         this.handleCheckedChange = (event) => {
             const selectedItems = event.detail.selectedItems;
             this.count = selectedItems.length;
@@ -16,6 +12,11 @@ export class FilterAccordion {
             event.stopPropagation();
             this.expanded = !this.expanded;
         };
+        this.expanded = false;
+        this.maxVisibleItems = undefined;
+        this.count = 0;
+        this.totalItems = 0;
+        this.filterGroupName = "";
     }
     componentWillLoad() {
         this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);

package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-accordion.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAOrD,MAAM,OAAO,eAAe~~;IAL5B;QAMU~~,gBAAW,GAAG,KAAK,CAAC;~~QAEnB~~,~~aAAQ,GAAY,KAAK,CAAC;QAE1B,UAAK,GAAW,CAAC,CAAC;QAClB,eAAU,GAAG,CAAC,CAAC;QAEhB,oBAAe,GAAG,EAAE,CAAC;QAkB/B,~~wBAAmB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACzC,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC;YACjD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;QAC/F,CAAC,CAAA;QAMD,oBAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;YACtC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAA;~~KA+BF~~;~~IA1DC~~,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEtE,CAAC;IAEH,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,MAAM,aAAa,GAAG,yBAAyB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACzD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,4CAA4C;QACvE,CAAC;IACH,CAAC;IASC,mBAAmB;QACjB,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACzE,CAAC;IAOD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,aAAa,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;YACxD,4DAAK,KAAK,EAAE,UAAU,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe;gBACpF,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;oBAC5D,4DAAK,KAAK,EAAC,MAAM;wBACf,+DAAO,IAAI,CAAC,eAAe,CAAQ;wBACnC,+EAAuB,IAAI,CAAC,KAAK,CAAwB,CACrD;oBACN,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,EACpC,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB;oBACZ,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EACpC,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB,CACR,CACF;YACL,IAAI,CAAC,QAAQ;gBACZ,4DAAK,KAAK,EAAC,4BAA4B;oBACrC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CAEJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n tag: 'ifx-filter-accordion',\n styleUrl: 'filter-accordion.scss',\n shadow: true,\n})\nexport class FilterAccordion {\n private initialized = false;\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @Prop() maxVisibleItems: number;\n @State() count: number = 0;\n @State() totalItems = 0;\n\n @Prop() filterGroupName = \"\";\n\n @Event() ifxFilterAccordionChange: EventEmitter;\n\n componentWillLoad() {\n this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n }\n\ncomponentDidLoad() {\n if (!this.initialized) {\n const selectedItems = getInitiallySelectedItems(this.el);\n this.count = selectedItems.length;\n this.initialized = true; // Prevent further execution in future calls\n }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n const selectedItems = event.detail.selectedItems;\n this.count = selectedItems.length;\n this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n }\n\n componentWillUnload() {\n this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n }\n\n toggleAccordion = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n render() {\n return (\n <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n <div class=\"text\">\n <span>{this.filterGroupName}</span>\n <ifx-number-indicator>{this.count}</ifx-number-indicator>\n </div>\n <ifx-icon\n class={this.expanded ? '' : 'hidden'}\n icon=\"minus-16\"\n onClick={this.toggleAccordion}\n ></ifx-icon>\n <ifx-icon\n class={this.expanded ? 'hidden' : ''}\n icon=\"plus-16\"\n onClick={this.toggleAccordion}\n ></ifx-icon>\n </div>\n </div>\n {this.expanded &&\n <div class=\"filter-accordion-container\">\n <slot name=\"list\"></slot>\n </div>\n }\n </div>\n );\n }\n}"]}
1	+ {"version":3,"file":"filter-accordion.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAOrD,MAAM,OAAO,eAAe;;QAClB,gBAAW,GAAG,KAAK,CAAC;QAyB9B,wBAAmB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACzC,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC;YACjD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;QAC/F,CAAC,CAAA;QAMD,oBAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;YACtC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAA;wBApC4B,KAAK;;qBAET,CAAC;0BACJ,CAAC;+BAEG,EAAE;;IAI5B,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEtE,CAAC;IAEH,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,MAAM,aAAa,GAAG,yBAAyB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACzD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,4CAA4C;QACvE,CAAC;IACH,CAAC;IASC,mBAAmB;QACjB,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACzE,CAAC;IAOD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,aAAa,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;YACxD,4DAAK,KAAK,EAAE,UAAU,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe;gBACpF,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;oBAC5D,4DAAK,KAAK,EAAC,MAAM;wBACf,+DAAO,IAAI,CAAC,eAAe,CAAQ;wBACnC,+EAAuB,IAAI,CAAC,KAAK,CAAwB,CACrD;oBACN,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,EACpC,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB;oBACZ,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EACpC,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB,CACR,CACF;YACL,IAAI,CAAC,QAAQ;gBACZ,4DAAK,KAAK,EAAC,4BAA4B;oBACrC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CAEJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n tag: 'ifx-filter-accordion',\n styleUrl: 'filter-accordion.scss',\n shadow: true,\n})\nexport class FilterAccordion {\n private initialized = false;\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @Prop() maxVisibleItems: number;\n @State() count: number = 0;\n @State() totalItems = 0;\n\n @Prop() filterGroupName = \"\";\n\n @Event() ifxFilterAccordionChange: EventEmitter;\n\n componentWillLoad() {\n this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n }\n\ncomponentDidLoad() {\n if (!this.initialized) {\n const selectedItems = getInitiallySelectedItems(this.el);\n this.count = selectedItems.length;\n this.initialized = true; // Prevent further execution in future calls\n }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n const selectedItems = event.detail.selectedItems;\n this.count = selectedItems.length;\n this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n }\n\n componentWillUnload() {\n this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n }\n\n toggleAccordion = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n render() {\n return (\n <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n <div class=\"text\">\n <span>{this.filterGroupName}</span>\n <ifx-number-indicator>{this.count}</ifx-number-indicator>\n </div>\n <ifx-icon\n class={this.expanded ? '' : 'hidden'}\n icon=\"minus-16\"\n onClick={this.toggleAccordion}\n ></ifx-icon>\n <ifx-icon\n class={this.expanded ? 'hidden' : ''}\n icon=\"plus-16\"\n onClick={this.toggleAccordion}\n ></ifx-icon>\n </div>\n </div>\n {this.expanded &&\n <div class=\"filter-accordion-container\">\n <slot name=\"list\"></slot>\n </div>\n }\n </div>\n );\n }\n}"]}

package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js CHANGED Viewed

@@ -1,9 +1,13 @@
 import { h } from "@stencil/core";
 export class FilterSearch {
     constructor() {
+        this.filterName = undefined;
         this.disabled = false;
+        this.filterValue = undefined;
+        this.filterKey = undefined;
         this.showDeleteIcon = false;
-        this.filterOrientation = 'sidebar'; //topbar
+        this.filterOrientation = 'sidebar';
+        this.placeholder = undefined;
     }
     valueChanged(newValue) {
         this.host.setAttribute('value', newValue.toString());

package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-search.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-search/filter-search.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOvG,MAAM,OAAO,YAAY~~;IALzB;QAQU~~,~~aAAQ,GAAY,~~KAAK,~~CAAC;QAGzB,mBAAc,GAAY,~~KAAK~~,CAAC~~;~~QACjC~~,~~sBAAiB,GAAW,~~SAAS,~~CAAC,CAAC,QAAQ;KAwCxD;IAlCC,~~YAAY,CAAC,QAAiB;QAC5B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;IACvD,CAAC;IAGD,wBAAwB,CAAC,KAAkB;QACzC,mEAAmE;QACnE,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,kCAAkC,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC;QACpH,IAAI,cAAc,IAAI,cAAc,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;YACnD,MAAM,IAAI,KAAK,CAAC,kCAAkC,IAAI,CAAC,UAAU,mBAAmB,CAAC,CAAC;QACxF,CAAC;QAED,oFAAoF;QACpF,mEAAmE;QACnE,uFAAuF;QACvF,IAAI;QAEJ,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;QAChC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,WAAW,KAAK,EAAE,CAAC;QAC9C,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,iDAAiD;IAC/K,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,GACZ,IAAI,CAAC,iBAAiB,KAAK,SAAS,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,8BACzE,EAAE;YACF,4DAAK,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,UAAU,CAAO;YAChD,yEAAkB,WAAW,EAAE,IAAI,CAAC,WAAW,sBAAoB,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GACrH,CACb,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Listen, Watch, Element, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-filter-search',\n styleUrl: 'filter-search.scss',\n shadow: true,\n})\nexport class FilterSearch {\n @Element() host: HTMLElement;\n @Prop() filterName: string;\n @Prop() disabled: boolean = false;\n @Prop({ mutable: true }) filterValue: string;\n @Prop() filterKey: string;\n @State() showDeleteIcon: boolean = false;\n @Prop() filterOrientation: string = 'sidebar'; //topbar\n @Prop() placeholder: string;\n\n @Event() ifxFilterSearchChange: EventEmitter;\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n this.host.setAttribute('value', newValue.toString());\n }\n\n @Listen('ifxInput')\n handleFilterSearchChange(event: CustomEvent) {\n // Check if a search filter with the same filterName already exists\n const existingFilter = this.host.parentElement.querySelector(`ifx-filter-search[filter-name=\"${this.filterName}\"]`);\n if (existingFilter && existingFilter !== this.host) {\n throw new Error(`A search filter with the name '${this.filterName}' already exists.`);\n }\n\n // // Check if the filterName is 'search' and the filter is not the search component\n // if (this.filterName === 'search' && this.filterKey !== 'text') {\n // throw new Error(\"The filter name 'search' is reserved for the search component.\");\n // }\n\n this.filterValue = event.detail;\n this.showDeleteIcon = this.filterValue !== \"\";\n this.ifxFilterSearchChange.emit({ filterName: this.filterName, filterValue: this.filterValue, filterKey: this.filterKey }); // Emitting filterKey along with other properties\n }\n\n\n render() {\n return (\n <div class={`${\n this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'\n }`}>\n <div class=\"filter-name\">{this.filterName}</div>\n <ifx-search-field placeholder={this.placeholder} show-delete-icon={this.showDeleteIcon} disabled={this.disabled} value={this.filterValue}>\n </ifx-search-field>\n </div>\n );\n }\n}\n\n"]}
1	+ {"version":3,"file":"filter-search.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-search/filter-search.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOvG,MAAM,OAAO,YAAY;;;wBAGK,KAAK;;;8BAGE,KAAK;iCACJ,SAAS;;;IAM7C,YAAY,CAAC,QAAiB;QAC5B,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;IACvD,CAAC;IAGD,wBAAwB,CAAC,KAAkB;QACzC,mEAAmE;QACnE,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,kCAAkC,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC;QACpH,IAAI,cAAc,IAAI,cAAc,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;YACnD,MAAM,IAAI,KAAK,CAAC,kCAAkC,IAAI,CAAC,UAAU,mBAAmB,CAAC,CAAC;QACxF,CAAC;QAED,oFAAoF;QACpF,mEAAmE;QACnE,uFAAuF;QACvF,IAAI;QAEJ,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;QAChC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,WAAW,KAAK,EAAE,CAAC;QAC9C,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,iDAAiD;IAC/K,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,GACZ,IAAI,CAAC,iBAAiB,KAAK,SAAS,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,8BACzE,EAAE;YACF,4DAAK,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,UAAU,CAAO;YAChD,yEAAkB,WAAW,EAAE,IAAI,CAAC,WAAW,sBAAoB,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GACrH,CACb,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Listen, Watch, Element, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-filter-search',\n styleUrl: 'filter-search.scss',\n shadow: true,\n})\nexport class FilterSearch {\n @Element() host: HTMLElement;\n @Prop() filterName: string;\n @Prop() disabled: boolean = false;\n @Prop({ mutable: true }) filterValue: string;\n @Prop() filterKey: string;\n @State() showDeleteIcon: boolean = false;\n @Prop() filterOrientation: string = 'sidebar'; //topbar\n @Prop() placeholder: string;\n\n @Event() ifxFilterSearchChange: EventEmitter;\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n this.host.setAttribute('value', newValue.toString());\n }\n\n @Listen('ifxInput')\n handleFilterSearchChange(event: CustomEvent) {\n // Check if a search filter with the same filterName already exists\n const existingFilter = this.host.parentElement.querySelector(`ifx-filter-search[filter-name=\"${this.filterName}\"]`);\n if (existingFilter && existingFilter !== this.host) {\n throw new Error(`A search filter with the name '${this.filterName}' already exists.`);\n }\n\n // // Check if the filterName is 'search' and the filter is not the search component\n // if (this.filterName === 'search' && this.filterKey !== 'text') {\n // throw new Error(\"The filter name 'search' is reserved for the search component.\");\n // }\n\n this.filterValue = event.detail;\n this.showDeleteIcon = this.filterValue !== \"\";\n this.ifxFilterSearchChange.emit({ filterName: this.filterName, filterValue: this.filterValue, filterKey: this.filterKey }); // Emitting filterKey along with other properties\n }\n\n\n render() {\n return (\n <div class={`${\n this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'\n }`}>\n <div class=\"filter-name\">{this.filterName}</div>\n <ifx-search-field placeholder={this.placeholder} show-delete-icon={this.showDeleteIcon} disabled={this.disabled} value={this.filterValue}>\n </ifx-search-field>\n </div>\n );\n }\n}\n\n"]}

package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js CHANGED Viewed

@@ -1,7 +1,6 @@
 import { h, Host } from "@stencil/core";
 export class IfxFilterTypeGroup {
     constructor() {
-        this.selectedOptions = [];
         this.handleResetEvent = () => {
             const accordionSlot = this.el.shadowRoot.querySelector('slot[name="filter-accordion"]');
             const filterAccordionSlottedElements = accordionSlot.assignedElements({ flatten: true });
@@ -104,6 +103,7 @@ export class IfxFilterTypeGroup {
             // Emit the entire selectedOptions array
             this.ifxSidebarFilterChange.emit(this.selectedOptions);
         };
+        this.selectedOptions = [];
     }
     /* If the component is ever removed and then reattached to the DOM,
     connectedCallback ensures that the event listeners are properly set up again */

package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-type-group.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/filter-type-group/filter-type-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOxF,MAAM,OAAO,kBAAkB;IAL/B;QAOW,oBAAe,GAA+H,EAAE,CAAC;QAqB1J,qBAAgB,GAAG,GAAG,EAAE;YACtB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,+BAA+B,CAAC,CAAC;YACxF,MAAM,8BAA8B,GAAI,aAAiC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAG9G,8BAA8B,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;gBACxD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;gBAE/D,QAAQ,CAAC,OAAO,CAAC,CAAC,cAAkC,EAAE,EAAE;oBACtD,cAAc,CAAC,YAAY,GAAG,CAAC,cAAc,CAAC,YAAY,CAAC;gBAC7D,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,MAAM,gBAAgB,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;YACxF,MAAM,2BAA2B,GAAI,gBAAoC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAE9G,2BAA2B,CAAC,OAAO,CAAC,CAAC,mBAAgC,EAAE,EAAE;gBACvE,MAAM,YAAY,GAAG,mBAAmB,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;gBAE5E,MAAM,WAAW,GAAG,YAAY,CAAC,UAAU,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;gBAEhF,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;oBAC3B,WAAW,CAAC,OAAO,CAAC,CAAC,kBAAuB,EAAE,EAAE;wBAC9C,kBAAkB,CAAC,KAAK,GAAG,EAAE,CAAC;oBAChC,CAAC,CAAC,CAAC;gBAEL,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;YAE1B,mFAAmF;YACnF,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;QAED,8BAAyB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACjD,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;YAEpC,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,+BAA+B,CAAC,CAAC;YACxF,MAAM,8BAA8B,GAAG,aAAa,CAAC,CAAC,CAAE,aAAiC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YAEnI,8BAA8B,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;gBACxD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;gBAE/D,QAAQ,CAAC,OAAO,CAAC,CAAC,cAAkC,EAAE,EAAE;oBACtD,IAAI,cAAc,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,UAAU,EAAE,CAAC;wBACvD,cAAc,CAAC,YAAY,GAAG,CAAC,cAAc,CAAC,YAAY,CAAC;oBAC7D,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,qDAAqD;YACrD,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;YAClF,MAAM,2BAA2B,GAAG,UAAU,CAAC,CAAC,CAAE,UAA8B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YAEvH,2BAA2B,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;gBAClD,IAAI,aAAa,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE,CAAC;oBACjD,2DAA2D;oBAC3D,MAAM,qBAAqB,GAAG,aAA4B,CAAC;oBACzD,MAAM,WAAW,GAAQ,qBAAqB,CAAC,iBAAiB,CAAC;oBACjE,IAAI,WAAW,EAAE,CAAC;wBACf,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;wBACvC,WAAW,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,kCAAkC;oBAC3I,CAAC;gBAEL,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBAC3D,IAAI,MAAM,CAAC,eAAe,KAAK,UAAU,EAAE,CAAC;oBAC1C,uCAAY,MAAM,KAAE,aAAa,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,IAAG;gBACrD,CAAC;gBACD,OAAO,MAAM,CAAC;YAChB,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,eAAe,GAAG,kBAAkB,CAAC;YAE1C,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;QAGD,0BAAqB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC7C,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAA;QAED,uBAAkB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1C,8DAA8D;YAC9D,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAA;QAGD,uBAAkB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1C,2CAA2C;YAC3C,MAAM,kBAAkB,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC;YAErD,8BAA8B;YAC9B,IAAI,KAAK,CAAC,IAAI,KAAK,uBAAuB,EAAE,CAAC;gBAC3C,yCAAyC;gBACzC,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBAEjD,oDAAoD;gBACpD,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,MAAM,KAAK,QAAQ,IAAI,MAAM,CAAC,eAAe,KAAK,UAAU,CAAC,CAAC;gBAExI,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE,CAAC;oBAC/B,mDAAmD;oBACnD,kBAAkB,CAAC,mBAAmB,CAAC,CAAC,KAAK,GAAG,WAAW,CAAC;gBAC9D,CAAC;qBAAM,CAAC;oBACN,wDAAwD;oBACxD,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;gBAC/E,CAAC;YACH,CAAC;iBAAM,IAAI,KAAK,CAAC,IAAI,KAAK,0BAA0B,EAAE,CAAC;gBACrD,MAAM,EAAE,eAAe,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBAExD,+DAA+D;gBAC/D,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,eAAe,KAAK,eAAe,CAAC,CAAC;gBAE/G,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE,CAAC;oBAC/B,iEAAiE;oBACjE,kBAAkB,CAAC,mBAAmB,CAAC,GAAG,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC;gBAC/E,CAAC;qBAAM,CAAC;oBACN,oEAAoE;oBACpE,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;gBAC9D,CAAC;YACH,CAAC;YAED,iDAAiD;YACjD,IAAI,CAAC,eAAe,GAAG,kBAAkB,CAAC;YAE1C,wCAAwC;YACxC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;KAYF;IA9JC;mFAC+E;IAC/E,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,0BAA0B,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACjF,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,uBAAuB,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC3E,MAAM,CAAC,gBAAgB,CAAC,sBAAsB,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACvE,MAAM,CAAC,gBAAgB,CAAC,wBAAwB,EAAE,IAAI,CAAC,yBAAyB,CAAC,CAAC;IACnF,CAAC;IAGF,mBAAmB;QACjB,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,0BAA0B,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACpF,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,uBAAuB,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC9E,MAAM,CAAC,mBAAmB,CAAC,sBAAsB,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC5E,CAAC;IAsID,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,mBAAmB;gBAC5B,6DAAM,IAAI,EAAC,eAAe,GAAG;gBAC7B,6DAAM,IAAI,EAAC,kBAAkB,GAAG,CAC5B,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, State, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n@Component({\n tag: 'ifx-filter-type-group',\n styleUrl: 'filter-type-group.scss',\n shadow: true,\n})\nexport class IfxFilterTypeGroup {\n @Element() el: HTMLElement;\n @State() selectedOptions: Array<{ filterGroupName: string, selectedItems?: Array<{ filterName: string, value: boolean \| string }>, value?: string }> = [];\n @Event() ifxSidebarFilterChange: EventEmitter;\n\n\n\n /* If the component is ever removed and then reattached to the DOM, \n connectedCallback ensures that the event listeners are properly set up again */\n connectedCallback() {\n this.el.addEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n this.el.addEventListener('ifxFilterSearchChange', this.handleSearchChange);\n window.addEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n window.addEventListener('ifxUpdateSidebarFilter', this.handleUpdateSidebarFilter);\n }\n\n\n componentWillUnload() {\n this.el.removeEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n this.el.removeEventListener('ifxFilterSearchChange', this.handleSearchChange);\n window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n }\n\n handleResetEvent = () => {\n const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n const filterAccordionSlottedElements = (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n\n filterAccordionSlottedElements.forEach(accordionElement => {\n const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n });\n });\n\n const filterSearchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n const filterSearchSlottedElements = (filterSearchSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n filterSearchSlottedElements.forEach((filterSearchWrapper: HTMLElement) => {\n const filterSearch = filterSearchWrapper.querySelector('ifx-filter-search');\n\n const searchField = filterSearch.shadowRoot.querySelectorAll('ifx-search-field')\n\n if (searchField.length > 0) {\n searchField.forEach((searchFieldElement: any) => {\n searchFieldElement.value = '';\n });\n\n }\n });\n\n this.selectedOptions = [];\n\n // Emit the change to inform any parent components that the filters have been reset\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n handleUpdateSidebarFilter = (event: CustomEvent) => {\n const { filterName } = event.detail;\n\n const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n const filterAccordionSlottedElements = accordionSlot ? (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true }) : [];\n\n filterAccordionSlottedElements.forEach(accordionElement => {\n const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n if (ifxListElement.getAttribute('name') === filterName) {\n ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n }\n });\n });\n\n // Clear the search bar within the filter-search slot\n const searchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n const filterSearchSlottedElements = searchSlot ? (searchSlot as HTMLSlotElement).assignedNodes({ flatten: true }) : [];\n \n filterSearchSlottedElements.forEach(searchElement => {\n if (searchElement.nodeType === Node.ELEMENT_NODE) {\n // Identify the ifx-filter-search component within the slot\n const filterSearchComponent = searchElement as HTMLElement;\n const searchField: any = filterSearchComponent.firstElementChild;\n if (searchField) {\n searchField.setAttribute('value', '');\n searchField.dispatchEvent(new CustomEvent('ifxInput', { bubbles: true, composed: true, detail: '' })); // Trigger ifxInput event to reset\n }\n \n }\n });\n\n const newSelectedOptions = this.selectedOptions.map(option => {\n if (option.filterGroupName === filterName) {\n return { ...option, selectedItems: [], value: '' };\n }\n return option;\n });\n\n this.selectedOptions = newSelectedOptions;\n\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n\n handleAccordionChange = (event: CustomEvent) => {\n this.handleFilterChange(event);\n }\n\n handleSearchChange = (event: CustomEvent) => {\n // Call handleFilterChange with the created CustomEvent object\n this.handleFilterChange(event);\n }\n\n\n handleFilterChange = (event: CustomEvent) => {\n // Create a new array to hold the new state\n const newSelectedOptions = [...this.selectedOptions];\n\n // Check the type of the event\n if (event.type === 'ifxFilterSearchChange') {\n // Handle the ifxFilterSearchChange event\n const { filterName, filterValue } = event.detail;\n\n // Find the existing filter with the same filterName\n const existingOptionIndex = newSelectedOptions.findIndex(option => typeof option !== 'string' && option.filterGroupName === filterName);\n\n if (existingOptionIndex !== -1) {\n // If an existing filter is found, update its value\n newSelectedOptions[existingOptionIndex].value = filterValue;\n } else {\n // If no existing filter is found, append the new filter\n newSelectedOptions.push({ filterGroupName: filterName, value: filterValue });\n }\n } else if (event.type === 'ifxFilterAccordionChange') {\n const { filterGroupName, selectedItems } = event.detail;\n\n // Find the existing filter group with the same filterGroupName\n const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterGroupName === filterGroupName);\n\n if (existingOptionIndex !== -1) {\n // If an existing filter group is found, update its selectedItems\n newSelectedOptions[existingOptionIndex] = { filterGroupName, selectedItems };\n } else {\n // If no existing filter group is found, append the new filter group\n newSelectedOptions.push({ filterGroupName, selectedItems });\n }\n }\n\n // Update the state with the new selected options\n this.selectedOptions = newSelectedOptions;\n\n // Emit the entire selectedOptions array\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n render() {\n return (\n <Host>\n <div class=\"filter-type-group\">\n <slot name=\"filter-search\" />\n <slot name=\"filter-accordion\" />\n </div>\n </Host>\n );\n }\n}"]}
1	+ {"version":3,"file":"filter-type-group.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/filter-type-group/filter-type-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOxF,MAAM,OAAO,kBAAkB;;QAuB7B,qBAAgB,GAAG,GAAG,EAAE;YACtB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,+BAA+B,CAAC,CAAC;YACxF,MAAM,8BAA8B,GAAI,aAAiC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAG9G,8BAA8B,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;gBACxD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;gBAE/D,QAAQ,CAAC,OAAO,CAAC,CAAC,cAAkC,EAAE,EAAE;oBACtD,cAAc,CAAC,YAAY,GAAG,CAAC,cAAc,CAAC,YAAY,CAAC;gBAC7D,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,MAAM,gBAAgB,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;YACxF,MAAM,2BAA2B,GAAI,gBAAoC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAE9G,2BAA2B,CAAC,OAAO,CAAC,CAAC,mBAAgC,EAAE,EAAE;gBACvE,MAAM,YAAY,GAAG,mBAAmB,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;gBAE5E,MAAM,WAAW,GAAG,YAAY,CAAC,UAAU,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;gBAEhF,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;oBAC3B,WAAW,CAAC,OAAO,CAAC,CAAC,kBAAuB,EAAE,EAAE;wBAC9C,kBAAkB,CAAC,KAAK,GAAG,EAAE,CAAC;oBAChC,CAAC,CAAC,CAAC;gBAEL,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;YAE1B,mFAAmF;YACnF,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;QAED,8BAAyB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACjD,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;YAEpC,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,+BAA+B,CAAC,CAAC;YACxF,MAAM,8BAA8B,GAAG,aAAa,CAAC,CAAC,CAAE,aAAiC,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YAEnI,8BAA8B,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;gBACxD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;gBAE/D,QAAQ,CAAC,OAAO,CAAC,CAAC,cAAkC,EAAE,EAAE;oBACtD,IAAI,cAAc,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,UAAU,EAAE,CAAC;wBACvD,cAAc,CAAC,YAAY,GAAG,CAAC,cAAc,CAAC,YAAY,CAAC;oBAC7D,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,qDAAqD;YACrD,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;YAClF,MAAM,2BAA2B,GAAG,UAAU,CAAC,CAAC,CAAE,UAA8B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YAEvH,2BAA2B,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;gBAClD,IAAI,aAAa,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE,CAAC;oBACjD,2DAA2D;oBAC3D,MAAM,qBAAqB,GAAG,aAA4B,CAAC;oBACzD,MAAM,WAAW,GAAQ,qBAAqB,CAAC,iBAAiB,CAAC;oBACjE,IAAI,WAAW,EAAE,CAAC;wBACf,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;wBACvC,WAAW,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,kCAAkC;oBAC3I,CAAC;gBAEL,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBAC3D,IAAI,MAAM,CAAC,eAAe,KAAK,UAAU,EAAE,CAAC;oBAC1C,uCAAY,MAAM,KAAE,aAAa,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,IAAG;gBACrD,CAAC;gBACD,OAAO,MAAM,CAAC;YAChB,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,eAAe,GAAG,kBAAkB,CAAC;YAE1C,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;QAGD,0BAAqB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC7C,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAA;QAED,uBAAkB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1C,8DAA8D;YAC9D,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAA;QAGD,uBAAkB,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1C,2CAA2C;YAC3C,MAAM,kBAAkB,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC;YAErD,8BAA8B;YAC9B,IAAI,KAAK,CAAC,IAAI,KAAK,uBAAuB,EAAE,CAAC;gBAC3C,yCAAyC;gBACzC,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBAEjD,oDAAoD;gBACpD,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,MAAM,KAAK,QAAQ,IAAI,MAAM,CAAC,eAAe,KAAK,UAAU,CAAC,CAAC;gBAExI,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE,CAAC;oBAC/B,mDAAmD;oBACnD,kBAAkB,CAAC,mBAAmB,CAAC,CAAC,KAAK,GAAG,WAAW,CAAC;gBAC9D,CAAC;qBAAM,CAAC;oBACN,wDAAwD;oBACxD,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;gBAC/E,CAAC;YACH,CAAC;iBAAM,IAAI,KAAK,CAAC,IAAI,KAAK,0BAA0B,EAAE,CAAC;gBACrD,MAAM,EAAE,eAAe,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;gBAExD,+DAA+D;gBAC/D,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,eAAe,KAAK,eAAe,CAAC,CAAC;gBAE/G,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE,CAAC;oBAC/B,iEAAiE;oBACjE,kBAAkB,CAAC,mBAAmB,CAAC,GAAG,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC;gBAC/E,CAAC;qBAAM,CAAC;oBACN,oEAAoE;oBACpE,kBAAkB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;gBAC9D,CAAC;YACH,CAAC;YAED,iDAAiD;YACjD,IAAI,CAAC,eAAe,GAAG,kBAAkB,CAAC;YAE1C,wCAAwC;YACxC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACzD,CAAC,CAAA;+BAvJsJ,EAAE;;IAKzJ;mFAC+E;IAC/E,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,0BAA0B,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACjF,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,uBAAuB,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC3E,MAAM,CAAC,gBAAgB,CAAC,sBAAsB,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACvE,MAAM,CAAC,gBAAgB,CAAC,wBAAwB,EAAE,IAAI,CAAC,yBAAyB,CAAC,CAAC;IACnF,CAAC;IAGF,mBAAmB;QACjB,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,0BAA0B,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACpF,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,uBAAuB,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC9E,MAAM,CAAC,mBAAmB,CAAC,sBAAsB,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC5E,CAAC;IAsID,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,mBAAmB;gBAC5B,6DAAM,IAAI,EAAC,eAAe,GAAG;gBAC7B,6DAAM,IAAI,EAAC,kBAAkB,GAAG,CAC5B,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, State, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n@Component({\n tag: 'ifx-filter-type-group',\n styleUrl: 'filter-type-group.scss',\n shadow: true,\n})\nexport class IfxFilterTypeGroup {\n @Element() el: HTMLElement;\n @State() selectedOptions: Array<{ filterGroupName: string, selectedItems?: Array<{ filterName: string, value: boolean \| string }>, value?: string }> = [];\n @Event() ifxSidebarFilterChange: EventEmitter;\n\n\n\n /* If the component is ever removed and then reattached to the DOM, \n connectedCallback ensures that the event listeners are properly set up again */\n connectedCallback() {\n this.el.addEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n this.el.addEventListener('ifxFilterSearchChange', this.handleSearchChange);\n window.addEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n window.addEventListener('ifxUpdateSidebarFilter', this.handleUpdateSidebarFilter);\n }\n\n\n componentWillUnload() {\n this.el.removeEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n this.el.removeEventListener('ifxFilterSearchChange', this.handleSearchChange);\n window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n }\n\n handleResetEvent = () => {\n const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n const filterAccordionSlottedElements = (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n\n filterAccordionSlottedElements.forEach(accordionElement => {\n const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n });\n });\n\n const filterSearchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n const filterSearchSlottedElements = (filterSearchSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n filterSearchSlottedElements.forEach((filterSearchWrapper: HTMLElement) => {\n const filterSearch = filterSearchWrapper.querySelector('ifx-filter-search');\n\n const searchField = filterSearch.shadowRoot.querySelectorAll('ifx-search-field')\n\n if (searchField.length > 0) {\n searchField.forEach((searchFieldElement: any) => {\n searchFieldElement.value = '';\n });\n\n }\n });\n\n this.selectedOptions = [];\n\n // Emit the change to inform any parent components that the filters have been reset\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n handleUpdateSidebarFilter = (event: CustomEvent) => {\n const { filterName } = event.detail;\n\n const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n const filterAccordionSlottedElements = accordionSlot ? (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true }) : [];\n\n filterAccordionSlottedElements.forEach(accordionElement => {\n const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n if (ifxListElement.getAttribute('name') === filterName) {\n ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n }\n });\n });\n\n // Clear the search bar within the filter-search slot\n const searchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n const filterSearchSlottedElements = searchSlot ? (searchSlot as HTMLSlotElement).assignedNodes({ flatten: true }) : [];\n \n filterSearchSlottedElements.forEach(searchElement => {\n if (searchElement.nodeType === Node.ELEMENT_NODE) {\n // Identify the ifx-filter-search component within the slot\n const filterSearchComponent = searchElement as HTMLElement;\n const searchField: any = filterSearchComponent.firstElementChild;\n if (searchField) {\n searchField.setAttribute('value', '');\n searchField.dispatchEvent(new CustomEvent('ifxInput', { bubbles: true, composed: true, detail: '' })); // Trigger ifxInput event to reset\n }\n \n }\n });\n\n const newSelectedOptions = this.selectedOptions.map(option => {\n if (option.filterGroupName === filterName) {\n return { ...option, selectedItems: [], value: '' };\n }\n return option;\n });\n\n this.selectedOptions = newSelectedOptions;\n\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n\n handleAccordionChange = (event: CustomEvent) => {\n this.handleFilterChange(event);\n }\n\n handleSearchChange = (event: CustomEvent) => {\n // Call handleFilterChange with the created CustomEvent object\n this.handleFilterChange(event);\n }\n\n\n handleFilterChange = (event: CustomEvent) => {\n // Create a new array to hold the new state\n const newSelectedOptions = [...this.selectedOptions];\n\n // Check the type of the event\n if (event.type === 'ifxFilterSearchChange') {\n // Handle the ifxFilterSearchChange event\n const { filterName, filterValue } = event.detail;\n\n // Find the existing filter with the same filterName\n const existingOptionIndex = newSelectedOptions.findIndex(option => typeof option !== 'string' && option.filterGroupName === filterName);\n\n if (existingOptionIndex !== -1) {\n // If an existing filter is found, update its value\n newSelectedOptions[existingOptionIndex].value = filterValue;\n } else {\n // If no existing filter is found, append the new filter\n newSelectedOptions.push({ filterGroupName: filterName, value: filterValue });\n }\n } else if (event.type === 'ifxFilterAccordionChange') {\n const { filterGroupName, selectedItems } = event.detail;\n\n // Find the existing filter group with the same filterGroupName\n const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterGroupName === filterGroupName);\n\n if (existingOptionIndex !== -1) {\n // If an existing filter group is found, update its selectedItems\n newSelectedOptions[existingOptionIndex] = { filterGroupName, selectedItems };\n } else {\n // If no existing filter group is found, append the new filter group\n newSelectedOptions.push({ filterGroupName, selectedItems });\n }\n }\n\n // Update the state with the new selected options\n this.selectedOptions = newSelectedOptions;\n\n // Emit the entire selectedOptions array\n this.ifxSidebarFilterChange.emit(this.selectedOptions);\n }\n\n render() {\n return (\n <Host>\n <div class=\"filter-type-group\">\n <slot name=\"filter-search\" />\n <slot name=\"filter-accordion\" />\n </div>\n </Host>\n );\n }\n}"]}

package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js CHANGED Viewed

@@ -1,5 +1,10 @@
 import { h } from "@stencil/core";
 export class ListEntry {
+    constructor() {
+        this.value = undefined;
+        this.label = undefined;
+        this.type = undefined;
+    }
     valueChanged(newValue) {
         if (newValue) {
             this.host.setAttribute('value', 'true');

package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"list-entry.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAOhG,MAAM,OAAO,SAAS;IAUpB,YAAY,CAAC,QAAiB;QAC5B,IAAI,QAAQ,EAAE,CAAC;YACb,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QAC1C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAGD,uBAAuB,CAAC,KAAkB;QACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1B,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IAC1F,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,CAC1B,WAAK,KAAK,EAAC,YAAY;YACrB,oBAAc,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAgB,CACnE,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,YAAY;YACrB,wBAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-entry',\n styleUrl: 'list-entry.scss',\n shadow: true,\n})\nexport class ListEntry {\n @Element() host: HTMLElement;\n @Prop({ mutable: true }) value: boolean;\n @Prop() label: string;\n\n @Prop() type: string;\n @Event() ifxListEntryChange: EventEmitter;\n\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n if (newValue) {\n this.host.setAttribute('value', 'true');\n } else {\n this.host.removeAttribute('value');\n }\n }\n\n @Listen('ifxChange')\n handleFilterEntryChange(event: CustomEvent) {\n this.value = event.detail;\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\n }\n\n\n render() {\n return (\n <div class=\"wrapper\">\n {this.type === 'checkbox' ? (\n <div class=\"list-entry\">\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\n </div>\n ) : (\n <div class=\"list-entry\">\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\n </div>\n )}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"list-entry.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAOhG,MAAM,OAAO,SAAS;;;;;;IAUpB,YAAY,CAAC,QAAiB;QAC5B,IAAI,QAAQ,EAAE,CAAC;YACb,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QAC1C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAGD,uBAAuB,CAAC,KAAkB;QACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1B,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IAC1F,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,CAC1B,WAAK,KAAK,EAAC,YAAY;YACrB,oBAAc,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAgB,CACnE,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,YAAY;YACrB,wBAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-entry',\n styleUrl: 'list-entry.scss',\n shadow: true,\n})\nexport class ListEntry {\n @Element() host: HTMLElement;\n @Prop({ mutable: true }) value: boolean;\n @Prop() label: string;\n\n @Prop() type: string;\n @Event() ifxListEntryChange: EventEmitter;\n\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n if (newValue) {\n this.host.setAttribute('value', 'true');\n } else {\n this.host.removeAttribute('value');\n }\n }\n\n @Listen('ifxChange')\n handleFilterEntryChange(event: CustomEvent) {\n this.value = event.detail;\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\n }\n\n\n render() {\n return (\n <div class=\"wrapper\">\n {this.type === 'checkbox' ? (\n <div class=\"list-entry\">\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\n </div>\n ) : (\n <div class=\"list-entry\">\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\n </div>\n )}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/table-advanced-version/list/list.js CHANGED Viewed

@@ -1,14 +1,6 @@
 import { h } from "@stencil/core";
 export class List {
     constructor() {
-        this.expanded = false;
-        this.showMore = false;
-        this.selectedCount = 0;
-        this.totalItems = 0;
-        this.name = "";
-        this.maxVisibleItems = 6;
-        this.type = "checkbox"; //default value
-        this.internalResetTrigger = false;
         this.handleMutation = () => {
             const newTotalItems = this.getTotalItems();
             if (newTotalItems !== this.totalItems) {
@@ -36,6 +28,15 @@ export class List {
             this.selectedCount = selectedItems.length;
             this.ifxListUpdate.emit({ name: this.name, selectedItems });
         };
+        this.expanded = false;
+        this.showMore = false;
+        this.selectedCount = 0;
+        this.totalItems = 0;
+        this.name = "";
+        this.maxVisibleItems = 6;
+        this.type = "checkbox";
+        this.resetTrigger = undefined;
+        this.internalResetTrigger = false;
     }
     handleTypeChange(newType) {
         this.updateListEntriesType(newType);

package/dist/collection/components/table-advanced-version/list/list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list',\n styleUrl: 'list.scss',\n shadow: true,\n})\nexport class List {\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @State() showMore = false;\n @State() selectedCount: number = 0;\n @State() totalItems = 0;\n @Prop() name = \"\";\n @Prop() maxVisibleItems = 6;\n @Prop() type: string = \"checkbox\"; //default value\n @Prop({ mutable: true }) resetTrigger: boolean;\n @State() internalResetTrigger: boolean = false;\n\n @Event() ifxListUpdate: EventEmitter;\n\n observer: MutationObserver;\n\n @Watch('type')\n handleTypeChange(newType: string) {\n this.updateListEntriesType(newType);\n }\n\n @Watch('resetTrigger')\n resetTriggerChanged(newValue: boolean) {\n if (newValue) {\n this.reset();\n this.resetTrigger = false; // Resetting the trigger after the action is performed\n }\n }\n\n componentWillLoad() {\n this.setupListenersAndObservers();\n this.initializeList();\n }\n\n disconnectedCallback() {\n this.cleanupListenersAndObservers();\n }\n\n reset() {\n this.resetListEntries();\n this.expanded = false;\n this.showMore = false;\n this.selectedCount = 0;\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\n }\n\n\n render() {\n return this.renderList();\n }\n\n\n // Refactored methods for clarity and maintainability\n private setupListenersAndObservers() {\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.el, { childList: true });\n }\n\n private cleanupListenersAndObservers() {\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer.disconnect();\n }\n \n private initializeList() {\n this.selectedCount = this.getSelectedItems(this.el).length;\n this.totalItems = this.getTotalItems();\n this.updateListEntriesType(this.type);\n this.checkRadioButtonConstraint();\n }\n\n \n private updateListEntriesType(newType: string) {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => entry.setAttribute('type', newType));\n }\n\n private resetListEntries() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => {\n entry.value = false;\n entry.setAttribute('value', 'false');\n });\n }\n\n private handleMutation = () => {\n const newTotalItems = this.getTotalItems();\n if (newTotalItems !== this.totalItems) {\n this.totalItems = newTotalItems;\n this.handleCheckedChange();\n }\n this.updateListEntriesType(this.type);\n }\n\n private checkRadioButtonConstraint() {\n if (this.type === 'radio-button' && this.selectedCount > 1) {\n this.resetListEntries(); // Reset all and let the user select again\n this.selectedCount = 0;\n }\n }\n\n getTotalItems() {\n return this.el.querySelectorAll('ifx-list-entry').length;\n }\n\n\n toggleList = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n toggleShowMore = (event: MouseEvent) => {\n event.stopPropagation();\n this.showMore = !this.showMore;\n }\n\n getSelectedItems(el: HTMLElement) {\n return Array.from(el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('value') === 'true')\n .map(entry => ({\n label: entry.getAttribute('label'),\n value: entry.getAttribute('value'),\n type: entry.getAttribute('type'),\n element: entry\n }));\n }\n\n\n handleCheckedChange = (event?: CustomEvent) => {\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\n }\n\n const selectedItems = this.getSelectedItems(this.el);\n this.selectedCount = selectedItems.length;\n\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\n }\n\n private renderList() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\n const remainingItems = listEntries.length - visibleItems.length;\n\n return (\n <div class=\"list-wrapper\">\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\n {(remainingItems > 0 \|\| this.showMore) && (\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-12' : 'chevron-down-12'} />\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\n </ifx-link>\n </div>\n )}\n </div>\n );\n }\n}"]}
1	+ {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list',\n styleUrl: 'list.scss',\n shadow: true,\n})\nexport class List {\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @State() showMore = false;\n @State() selectedCount: number = 0;\n @State() totalItems = 0;\n @Prop() name = \"\";\n @Prop() maxVisibleItems = 6;\n @Prop() type: string = \"checkbox\"; //default value\n @Prop({ mutable: true }) resetTrigger: boolean;\n @State() internalResetTrigger: boolean = false;\n\n @Event() ifxListUpdate: EventEmitter;\n\n observer: MutationObserver;\n\n @Watch('type')\n handleTypeChange(newType: string) {\n this.updateListEntriesType(newType);\n }\n\n @Watch('resetTrigger')\n resetTriggerChanged(newValue: boolean) {\n if (newValue) {\n this.reset();\n this.resetTrigger = false; // Resetting the trigger after the action is performed\n }\n }\n\n componentWillLoad() {\n this.setupListenersAndObservers();\n this.initializeList();\n }\n\n disconnectedCallback() {\n this.cleanupListenersAndObservers();\n }\n\n reset() {\n this.resetListEntries();\n this.expanded = false;\n this.showMore = false;\n this.selectedCount = 0;\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\n }\n\n\n render() {\n return this.renderList();\n }\n\n\n // Refactored methods for clarity and maintainability\n private setupListenersAndObservers() {\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.el, { childList: true });\n }\n\n private cleanupListenersAndObservers() {\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer.disconnect();\n }\n \n private initializeList() {\n this.selectedCount = this.getSelectedItems(this.el).length;\n this.totalItems = this.getTotalItems();\n this.updateListEntriesType(this.type);\n this.checkRadioButtonConstraint();\n }\n\n \n private updateListEntriesType(newType: string) {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => entry.setAttribute('type', newType));\n }\n\n private resetListEntries() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => {\n entry.value = false;\n entry.setAttribute('value', 'false');\n });\n }\n\n private handleMutation = () => {\n const newTotalItems = this.getTotalItems();\n if (newTotalItems !== this.totalItems) {\n this.totalItems = newTotalItems;\n this.handleCheckedChange();\n }\n this.updateListEntriesType(this.type);\n }\n\n private checkRadioButtonConstraint() {\n if (this.type === 'radio-button' && this.selectedCount > 1) {\n this.resetListEntries(); // Reset all and let the user select again\n this.selectedCount = 0;\n }\n }\n\n getTotalItems() {\n return this.el.querySelectorAll('ifx-list-entry').length;\n }\n\n\n toggleList = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n toggleShowMore = (event: MouseEvent) => {\n event.stopPropagation();\n this.showMore = !this.showMore;\n }\n\n getSelectedItems(el: HTMLElement) {\n return Array.from(el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('value') === 'true')\n .map(entry => ({\n label: entry.getAttribute('label'),\n value: entry.getAttribute('value'),\n type: entry.getAttribute('type'),\n element: entry\n }));\n }\n\n\n handleCheckedChange = (event?: CustomEvent) => {\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\n }\n\n const selectedItems = this.getSelectedItems(this.el);\n this.selectedCount = selectedItems.length;\n\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\n }\n\n private renderList() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\n const remainingItems = listEntries.length - visibleItems.length;\n\n return (\n <div class=\"list-wrapper\">\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\n {(remainingItems > 0 \|\| this.showMore) && (\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-12' : 'chevron-down-12'} />\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\n </ifx-link>\n </div>\n )}\n </div>\n );\n }\n}"]}

package/dist/collection/components/table-advanced-version/set-filter/setFilter.js CHANGED Viewed

@@ -2,7 +2,11 @@
 import { h } from "@stencil/core";
 export class SetFilter {
     constructor() {
+        this.filterName = undefined;
+        this.filterLabel = undefined;
+        this.placeholder = undefined;
         this.type = 'text';
+        this.options = undefined;
         this.filterValues = [];
     }
     handleTextInputChange(event) {

package/dist/collection/components/table-advanced-version/set-filter/setFilter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"setFilter.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/set-filter/setFilter.tsx"],"names":[],"mappings":"AAAA,gBAAgB;AAChB,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAO/E,MAAM,OAAO,SAAS~~;IALtB;QASU~~,~~SAAI,GAA8C,~~MAAM,~~CAAC;QAExD,iBAAY,GAAa,~~EAAE,~~CAAC;KAyDtC;IApDC,~~qBAAqB,CAAC,KAAY;QAChC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAChD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,gEAAgE;IAEtK,CAAC;IAED,wBAAwB,CAAC,KAAkB;QACzC,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,gEAAgE;IACtK,CAAC;IAGD,6BAA6B,CAAC,KAAkB;QAC9C,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,mEAAmE;QACrG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IAC/G,CAAC;IAGD,MAAM;QACJ,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,MAAM;gBACT,OAAO,CACL,sBAAgB,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAC1E,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,IACtD,IAAI,CAAC,WAAW,CAAkB,CACrC,CAAC;YACJ,KAAK,eAAe;gBAClB,OAAO,CACL,kBACE,WAAW,EAAC,MAAM,oBACH,MAAM,8BACI,WAAW,EACpC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,2BACnC,IAAI,CAAC,WAAW,eAC5B,IAAI,CAAC,WAAW,iBACd,IAAI,CAAC,OAAO,GACb,CACf,CAAC;YACJ,KAAK,cAAc;gBACjB,OAAO,CACL,uBACE,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,6BAA6B,CAAC,KAAK,CAAC,GAC/D,CACH,CAAC;YACJ;gBACE,OAAO,IAAI,CAAC;QAChB,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// SetFilter.tsx\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-set-filter',\n styleUrl: 'set-filter.scss',\n shadow: true\n})\nexport class SetFilter {\n @Prop() filterName: string;\n @Prop() filterLabel: string;\n @Prop() placeholder: string;\n @Prop() type: 'text' \| 'single-select' \| 'multi-select' = 'text';\n @Prop() options: any[] \| string;\n @State() filterValues: string[] = [];\n\n @Event() ifxFilterSelect: EventEmitter;\n\n\n handleTextInputChange(event: Event) {\n const target = event.target as HTMLInputElement;\n const value = target.value;\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n\n }\n\n handleSingleSelectChange(event: CustomEvent) {\n const value = event.detail.value;\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n }\n\n\n handleMultiselectOptionChange(event: CustomEvent) {\n this.filterValues = event.detail; // Assuming that ifx-multiselect emits an array of selected options\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\n }\n\n\n render() {\n switch (this.type) {\n case 'text':\n return (\n <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\n onIfxInput={event => this.handleTextInputChange(event)}\n >{this.filterLabel}</ifx-text-field>\n );\n case 'single-select':\n return (\n <ifx-select\n placeholder=\"true\"\n search-enabled=\"true\"\n search-placeholder-value=\"Search...\"\n onIfxSelect={event => this.handleSingleSelectChange(event)}\n ifx-placeholder-value={this.placeholder}\n ifx-label={this.filterLabel}\n ifx-options={this.options}\n ></ifx-select>\n );\n case 'multi-select':\n return (\n <ifx-multiselect\n label={this.filterLabel}\n placeholder={this.placeholder}\n options={this.options}\n onIfxSelect={event => this.handleMultiselectOptionChange(event)}\n />\n );\n default:\n return null;\n }\n }\n}\n\n"]}
1	+ {"version":3,"file":"setFilter.js","sourceRoot":"","sources":["../../../../src/components/table-advanced-version/set-filter/setFilter.tsx"],"names":[],"mappings":"AAAA,gBAAgB;AAChB,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAO/E,MAAM,OAAO,SAAS;;;;;oBAIsC,MAAM;;4BAE9B,EAAE;;IAKpC,qBAAqB,CAAC,KAAY;QAChC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAChD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,gEAAgE;IAEtK,CAAC;IAED,wBAAwB,CAAC,KAAkB;QACzC,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,gEAAgE;IACtK,CAAC;IAGD,6BAA6B,CAAC,KAAkB;QAC9C,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,mEAAmE;QACrG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IAC/G,CAAC;IAGD,MAAM;QACJ,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,MAAM;gBACT,OAAO,CACL,sBAAgB,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAC1E,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,IACtD,IAAI,CAAC,WAAW,CAAkB,CACrC,CAAC;YACJ,KAAK,eAAe;gBAClB,OAAO,CACL,kBACE,WAAW,EAAC,MAAM,oBACH,MAAM,8BACI,WAAW,EACpC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,2BACnC,IAAI,CAAC,WAAW,eAC5B,IAAI,CAAC,WAAW,iBACd,IAAI,CAAC,OAAO,GACb,CACf,CAAC;YACJ,KAAK,cAAc;gBACjB,OAAO,CACL,uBACE,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,6BAA6B,CAAC,KAAK,CAAC,GAC/D,CACH,CAAC;YACJ;gBACE,OAAO,IAAI,CAAC;QAChB,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// SetFilter.tsx\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-set-filter',\n styleUrl: 'set-filter.scss',\n shadow: true\n})\nexport class SetFilter {\n @Prop() filterName: string;\n @Prop() filterLabel: string;\n @Prop() placeholder: string;\n @Prop() type: 'text' \| 'single-select' \| 'multi-select' = 'text';\n @Prop() options: any[] \| string;\n @State() filterValues: string[] = [];\n\n @Event() ifxFilterSelect: EventEmitter;\n\n\n handleTextInputChange(event: Event) {\n const target = event.target as HTMLInputElement;\n const value = target.value;\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n\n }\n\n handleSingleSelectChange(event: CustomEvent) {\n const value = event.detail.value;\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n }\n\n\n handleMultiselectOptionChange(event: CustomEvent) {\n this.filterValues = event.detail; // Assuming that ifx-multiselect emits an array of selected options\n this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\n }\n\n\n render() {\n switch (this.type) {\n case 'text':\n return (\n <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\n onIfxInput={event => this.handleTextInputChange(event)}\n >{this.filterLabel}</ifx-text-field>\n );\n case 'single-select':\n return (\n <ifx-select\n placeholder=\"true\"\n search-enabled=\"true\"\n search-placeholder-value=\"Search...\"\n onIfxSelect={event => this.handleSingleSelectChange(event)}\n ifx-placeholder-value={this.placeholder}\n ifx-label={this.filterLabel}\n ifx-options={this.options}\n ></ifx-select>\n );\n case 'multi-select':\n return (\n <ifx-multiselect\n label={this.filterLabel}\n placeholder={this.placeholder}\n options={this.options}\n onIfxSelect={event => this.handleMultiselectOptionChange(event)}\n />\n );\n default:\n return null;\n }\n }\n}\n\n"]}

package/dist/collection/components/table-advanced-version/table.js CHANGED Viewed

@@ -6,44 +6,46 @@ import { CustomNoRowsOverlay } from "./customNoRowsOverlay";
 import { CustomLoadingOverlay } from "./customLoadingOverlay";
 export class Table {
     constructor() {
+        this.allRowData = [];
+        this.originalRowData = [];
         this.currentPage = 1;
+        this.cols = undefined;
+        this.rows = undefined;
+        this.buttonRendererOptions = undefined;
         this.rowData = [];
         this.colData = [];
         this.filterOptions = {};
         this.currentFilters = {};
-        this.allRowData = [];
+        this.uniqueKey = undefined;
         this.rowHeight = 'default';
         this.tableHeight = 'auto';
         this.pagination = true;
         this.paginationPageSize = 10;
-        this.filterOrientation = 'sidebar'; // topbar / none
+        this.filterOrientation = 'sidebar';
         this.showSidebarFilters = true;
         this.matchingResultsCount = 0;
         this.showLoading = false;
-        this.originalRowData = [];
     }
     handleChipChange(event) {
-        const { name, currentSelection, previousSelection } = event.detail;
-        if (currentSelection && previousSelection) {
-            // Clone the current filters state
-            const updatedFilters = Object.assign({}, this.currentFilters);
-            if (currentSelection.length === 0) {
-                // If there are no selections for this filter, delete the filter
-                delete updatedFilters[name];
-                // Emit event with specific filter name
-                const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });
-                this.host.dispatchEvent(customEvent);
-            }
-            else {
-                // Otherwise, update the filter values with the current selection
-                updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);
-            }
-            // Update the component's filters
-            this.currentFilters = updatedFilters;
-            // Ensure table data is updated
-            this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);
-            this.updateTableView();
+        const { name, currentSelection } = event.detail;
+        // Clone the current filters state
+        const updatedFilters = Object.assign({}, this.currentFilters);
+        if (currentSelection.length === 0) {
+            // If there are no selections for this filter, delete the filter
+            delete updatedFilters[name];
+            // Emit event with specific filter name
+            const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });
+            this.host.dispatchEvent(customEvent);
+        }
+        else {
+            // Otherwise, update the filter values with the current selection
+            updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);
         }
+        // Update the component's filters
+        this.currentFilters = updatedFilters;
+        // Ensure table data is updated
+        this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);
+        this.updateTableView();
     }
     onButtonRendererOptionsChanged() {
         this.colData = this.getColData(); // Re-fetch column data to apply new renderer options
@@ -354,12 +356,12 @@ export class Table {
             };
         }
         const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';
-        return (h(Host, { key: 'f18b6cec5505d34fdd3da9346a92b72a5db183d8' }, h("div", { key: '6ea2209db13f565998e8e40dc7285e37b22d7f02', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '68b8ea98a2dfe4f50eddbfd806352254d0f15085', class: "sidebar-btn" }, h("ifx-button", { key: '9659e6ffb40006c2c3ef10cb22f0fe5d4591d4b9', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '7a93c73b15b6d5c298404f62c4b4f34159e25d43', icon: "cross-12" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'd978efaf8f2f470ef075e4acdcb5124413a6d0e0', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '8857f97f108d874a5ffd8061794343f35c179f3a', class: "sidebar-container" }, h("div", { key: 'd0ed7ab70902bb90183d6efb311ebfe13f6d446e', class: "filters-title-container" }, h("span", { key: '938ebc632f39f3bb8a8d799562e28c647f864d32', class: "filters-title" }, "Filters")), h("div", { key: '229c6796de2d66978320550a0b10e3f9a526cbe0', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '8c94ebd8255eb777c91f220fb66ec8802d905c58', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '73253d641947aa7ad3d739ff35c44001b644726f', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '128299181dda59b6757f32d612865f41735aafe9', name: "topbar-filter" })))), h("div", { key: '2314cb7feffce3004d7a8dc0878216cd54c161f9', class: "table-pagination-wrapper" }, h("div", { key: 'a8dc9e0c93cf9f0ebf03f077c44ce52ce56b32b5', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
+        return (h(Host, { key: 'b729796301f2cbb41f9ed3f87eb1830dcd14f2f1' }, h("div", { key: '1aad01d8b7d76ce42e5e089a94d1301f912fdb3a', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '4c71ac71b270f9efa4e1b8050b64f59688b4d941', class: "sidebar-btn" }, h("ifx-button", { key: '92f0b620f0b93c75d8a3a61e29c5530864d04eb5', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: 'cdc76f610751c9fa5fa848a0bfd371b7cae2f5a0', icon: "cross-12" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'dba2a36c5516555903c831c536b2851648b2df1e', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '3f4bb65cc6ca31d4e51fe42a59cce0e20eea69f3', class: "sidebar-container" }, h("div", { key: '63487d20769bf234e2442d61a5dc5f82a69b97d6', class: "filters-title-container" }, h("span", { key: '3aed4afe6c475f7049eba269f3e0832fb2f7a61d', class: "filters-title" }, "Filters")), h("div", { key: 'eb71696ae6055053a75b7cda1fe39dca49be907d', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '57edff02ef255645c5be3a742ef55e031449d015', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: 'f7cbe678ba899380d23190e2b5abdaf0d399df97', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '370b0c55c190e53df30281d2e877d8b556c2b01a', name: "topbar-filter" })))), h("div", { key: '813e23cdac3baf819662e21d8b5ea718b09e4ef3', class: "table-pagination-wrapper" }, h("div", { key: 'e7d64df89d6686c0f4fc90f0abfcba27fbde37e9', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
             const filter = this.currentFilters[name];
             const filterValues = filter.filterValues;
             const isMultiSelect = filter.type !== 'text';
             return filterValues.length > 0 ? (h("ifx-chip", { placeholder: name, size: "large", variant: isMultiSelect ? "multi" : "single", readOnly: true, value: filterValues, key: name }, filterValues.map(filterValue => (h("ifx-chip-item", { value: filterValue, selected: true, key: filterValue }, filterValue))))) : null;
-        })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '2dc2b0e1c990ff316d07bad302f447dd099dafed', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '93339aded350f0c598e08d161542d42c0d2a0355', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '7a19c5a696186491d330a3490bd137464df51e6c', class: "matching-results-container" }, h("span", { key: '9dcd8b4836ecf81194c50f2f3c0de7cacf1ace94', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '64050c9f0634a2aa8324350807a9c194709ffba9', class: "matching-results-text" }, "matching results"))), h("div", { key: '11e110a39a2ae2dc350b0ebcc9e01de8c547ea82', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: 'e2abda5e3442a07fed3aa3bcf9b0aabce8e8456e', id: `ifxTable-${this.uniqueKey}`, class: 'ifx-ag-grid', style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage }) : null)))));
+        })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '9e9041366a224464301309ea6ac5301b86c8926a', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '0f088308085da2c7014bb3758bddaff11bb10b9b', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: 'e82ec3824a61f386ee20a6e9c865d0c92ab6c17e', class: "matching-results-container" }, h("span", { key: '0752f434d64de56f498f43a8e179943f8f82044a', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '0f3c5c1f3c5e38e10aae56e30693c29a2c1221f8', class: "matching-results-text" }, "matching results"))), h("div", { key: 'bbcffcc32dba388df4f1d0022cb986ba3ec3fcb2', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '3b596c305e94e20f6a3e9229396dea2ff77c7bbe', id: `ifxTable-${this.uniqueKey}`, class: 'ifx-ag-grid', style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage }) : null)))));
     }
     hasButtonCol() {
         return this.getColData().some(column => column.field === 'button');
@@ -618,7 +620,7 @@ export class Table {
     }
     static get listeners() {
         return [{
-                "name": "ifxChange",
+                "name": "ifxChipChange",
                 "method": "handleChipChange",
                 "target": undefined,
                 "capture": false,