@infineon/infineon-design-system-stencil 37.6.1--canary.1972.c978f8ac91ef429bb1f8bacc092c1bd327faa594.0 → 37.6.1--canary.1966.d2a6f1361762a2109b82aebf56cdd1ac6620628f.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 (27) hide show
  1. package/dist/cjs/ifx-modal.cjs.entry.js +18 -5
  2. package/dist/cjs/ifx-modal.cjs.entry.js.map +1 -1
  3. package/dist/cjs/ifx-table.cjs.entry.js +2 -7
  4. package/dist/cjs/ifx-table.cjs.entry.js.map +1 -1
  5. package/dist/collection/components/modal/modal.js +18 -5
  6. package/dist/collection/components/modal/modal.js.map +1 -1
  7. package/dist/collection/components/table-advanced-version/table.js +2 -7
  8. package/dist/collection/components/table-advanced-version/table.js.map +1 -1
  9. package/dist/components/ifx-modal.js +18 -5
  10. package/dist/components/ifx-modal.js.map +1 -1
  11. package/dist/components/ifx-table.js +2 -7
  12. package/dist/components/ifx-table.js.map +1 -1
  13. package/dist/esm/ifx-modal.entry.js +18 -5
  14. package/dist/esm/ifx-modal.entry.js.map +1 -1
  15. package/dist/esm/ifx-table.entry.js +2 -7
  16. package/dist/esm/ifx-table.entry.js.map +1 -1
  17. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
  18. package/dist/infineon-design-system-stencil/{p-d8755b62.entry.js → p-5afef060.entry.js} +2 -2
  19. package/dist/infineon-design-system-stencil/p-5afef060.entry.js.map +1 -0
  20. package/dist/infineon-design-system-stencil/p-cfc74752.entry.js +2 -0
  21. package/dist/infineon-design-system-stencil/p-cfc74752.entry.js.map +1 -0
  22. package/dist/types/components/modal/modal.d.ts +4 -1
  23. package/dist/types/components/table-advanced-version/table.d.ts +0 -1
  24. package/package.json +1 -1
  25. package/dist/infineon-design-system-stencil/p-3b22661a.entry.js +0 -2
  26. package/dist/infineon-design-system-stencil/p-3b22661a.entry.js.map +0 -1
  27. package/dist/infineon-design-system-stencil/p-d8755b62.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\n \ntype CloseEventTrigger = 'CLOSE_BUTTON' | 'ESCAPE_KEY' | 'BACKDROP';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n@Component({\n tag: 'ifx-modal',\n styleUrl: 'modal.scss',\n shadow: true\n})\nexport class IfxModal {\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n @State() showModal: boolean = this.opened || false;\n\n @Prop() caption: string = 'Modal Title';\n @Prop() closeOnOverlayClick: boolean = true;\n\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n\n @Prop() variant: 'default' | 'alert-brand' | 'alert-danger' = 'default';\n \n @Prop() size: 's' | 'm' | 'l' = 's';\n\n @Prop() alertIcon: string = '';\n @Prop() okButtonLabel: string = 'OK';\n @Prop() cancelButtonLabel: string = 'Cancel';\n @Element() hostElement: HTMLElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLButtonElement | HTMLIfxIconButtonElement;\n\n async componentDidLoad() {\n if(!isNestedInIfxComponent(this.hostElement)) { \n const framework = detectFramework();\n trackComponent('ifx-modal', await framework)\n }\n // Query all focusable elements and store them in `focusableElements`.\n // Needed for the \"focus trap\" functionality.\n this.focusableElements = queryShadowRoot(\n this.hostElement.shadowRoot,\n (el) => isHidden(el) || el.matches('[data-focus-trap-edge]'),\n isFocusable\n );\n }\n\n componentWillRender() { \n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n\n handleComponentOverflow() { \n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\n if (this.showModal && this.isModalContentContainerHeightReachedViewport()) {\n modalContentContainer.classList.add('no-overflow')\n } else if(modalContentContainer?.classList.contains('no-overflow')) { \n modalContentContainer?.classList.remove('no-overflow')\n }\n }\n\n getFirstFocusableElement(): HTMLElement | null {\n return this.focusableElements[0];\n }\n\n getLastFocusableElement(): HTMLElement | null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n attemptFocus(element: HTMLElement | null) {\n if (element == null) {\n setTimeout(() => { //wait until DOM is fully loaded\n this.closeButton.focus();\n },);\n return;\n }\n\n setTimeout(() => { //wait until DOM is fully loaded\n element.focus();\n }, 0);\n }\n\n open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n // Setting focus on last item and removing immediately\n // so, on tab press first element is focused\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.ifxOpen.emit();\n });\n\n this.hostElement.addEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.ifxOpen.emit();\n }\n }\n\n close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.ifxClose.emit();\n });\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.showModal = false;\n this.ifxClose.emit();\n }\n }\n\n handleKeypress = (event: KeyboardEvent) => {\n if (!this.showModal) {\n return;\n }\n if (event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some((event) => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue) {\n if (newValue === true) {\n this.open();\n } else {\n this.close()\n }\n }\n\n handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP')\n }\n }\n\n handleContentUpdate(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n if(nodes.length > 0) {\n nodes.forEach(node => {\n if (node.observer) {\n node.observer.disconnect();\n delete node.observer;\n }\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n node.observer = observer;\n });\n } \n }\n\n handleButtonsSlotChange(e) {\n if(e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\n this.slotButtonsPresent = true;\n }else{\n this.slotButtonsPresent = false;\n }\n }\n\n isModalContentContainerHeightReachedViewport() {\n //Adding timeout for proper height detection on Edge browser\n return new Promise(resolve => {\n setTimeout(() => {\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\n const modalContentHeight = modalContent.offsetHeight;\n const viewportHeight = window.innerHeight;\n resolve(modalContentHeight >= viewportHeight * 0.9);\n }, 100);\n });\n}\n\n\n render() {\n const isAlertVariant = this.variant !== 'default';\n return (\n <Host>\n <div\n ref={(el) => (this.modalContainer = el)}\n class={`modal-container ${this.showModal ? 'open' : ''}`}\n >\n <div\n class=\"modal-overlay\"\n onClick={() => this.handleOverlayClick()}\n ></div>\n <div\n data-focus-trap-edge\n onFocus={this.handleTopFocus}\n tabindex=\"0\"\n ></div>\n <div\n class={`modal-content-container ${this.size}`}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={this.caption}>\n {isAlertVariant ? (\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\n </div>\n ) : null}\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-caption\">{this.caption}</h2>\n { \n this.showCloseButton && \n <ifx-icon-button class = 'modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON') }>\n </ifx-icon-button>\n }\n </div>\n <div class=\"modal-body\">\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\n </div>\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\n <slot name=\"buttons\" onSlotchange={(e)=>this.handleButtonsSlotChange(e)}>\n </slot>\n </div>\n </div>\n </div>\n <div\n data-focus-trap-edge\n onFocus={this.handleBottomFocus}\n tabindex=\"0\"\n ></div>\n </div>\n </Host>\n\n );\n }\n}"]}
1
+ {"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\n \ntype CloseEventTrigger = 'CLOSE_BUTTON' | 'ESCAPE_KEY' | 'BACKDROP';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n@Component({\n tag: 'ifx-modal',\n styleUrl: 'modal.scss',\n shadow: true\n})\nexport class IfxModal {\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n @State() showModal: boolean = this.opened || false;\n\n @Prop() caption: string = 'Modal Title';\n @Prop() closeOnOverlayClick: boolean = true;\n\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n\n @Prop() variant: 'default' | 'alert-brand' | 'alert-danger' = 'default';\n \n @Prop() size: 's' | 'm' | 'l' = 's';\n\n @Prop() alertIcon: string = '';\n @Prop() okButtonLabel: string = 'OK';\n @Prop() cancelButtonLabel: string = 'Cancel';\n @Element() hostElement: HTMLElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLButtonElement | HTMLIfxIconButtonElement;\n private resizeTimeout: ReturnType<typeof setTimeout>;\n\n handleResize = () => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = setTimeout(() => {\n if (this.showModal) {\n this.handleComponentOverflow();\n }\n }, 100);\n};\n\n async componentDidLoad() {\n if(!isNestedInIfxComponent(this.hostElement)) { \n const framework = detectFramework();\n trackComponent('ifx-modal', await framework)\n }\n // Query all focusable elements and store them in `focusableElements`.\n // Needed for the \"focus trap\" functionality.\n this.focusableElements = queryShadowRoot(\n this.hostElement.shadowRoot,\n (el) => isHidden(el) || el.matches('[data-focus-trap-edge]'),\n isFocusable\n );\n window.addEventListener('resize', this.handleResize);\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize);\n}\n\n componentWillRender() { \n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n\n async handleComponentOverflow() { \n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\n if (this.showModal && await this.isModalContentContainerHeightReachedViewport()) {\n modalContentContainer.classList.add('no-overflow')\n } else if(modalContentContainer?.classList.contains('no-overflow')) { \n modalContentContainer?.classList.remove('no-overflow')\n }\n }\n\n getFirstFocusableElement(): HTMLElement | null {\n return this.focusableElements[0];\n }\n\n getLastFocusableElement(): HTMLElement | null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n attemptFocus(element: HTMLElement | null) {\n if (element == null) {\n setTimeout(() => { //wait until DOM is fully loaded\n this.closeButton.focus();\n },);\n return;\n }\n\n setTimeout(() => { //wait until DOM is fully loaded\n element.focus();\n }, 0);\n }\n\n open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n // Setting focus on last item and removing immediately\n // so, on tab press first element is focused\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.ifxOpen.emit();\n });\n\n this.hostElement.addEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.ifxOpen.emit();\n }\n }\n\n close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.ifxClose.emit();\n });\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.showModal = false;\n this.ifxClose.emit();\n }\n }\n\n handleKeypress = (event: KeyboardEvent) => {\n if (!this.showModal) {\n return;\n }\n if (event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some((event) => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue) {\n if (newValue === true) {\n this.open();\n } else {\n this.close()\n }\n }\n\n handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP')\n }\n }\n\n handleContentUpdate(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n if(nodes.length > 0) {\n nodes.forEach(node => {\n if (node.observer) {\n node.observer.disconnect();\n delete node.observer;\n }\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n node.observer = observer;\n });\n } \n }\n\n handleButtonsSlotChange(e) {\n if(e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\n this.slotButtonsPresent = true;\n }else{\n this.slotButtonsPresent = false;\n }\n }\n\n isModalContentContainerHeightReachedViewport() {\n //Adding timeout for proper height detection on Edge browser\n return new Promise(resolve => {\n setTimeout(() => {\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\n const modalContentHeight = modalContent.offsetHeight;\n const viewportHeight = window.innerHeight;\n const extraMarginForEdgeBrowser = 3;\n resolve(modalContentHeight + extraMarginForEdgeBrowser >= viewportHeight * 0.9);\n }, 100);\n });\n}\n\n\n render() {\n const isAlertVariant = this.variant !== 'default';\n return (\n <Host>\n <div\n ref={(el) => (this.modalContainer = el)}\n class={`modal-container ${this.showModal ? 'open' : ''}`}\n >\n <div\n class=\"modal-overlay\"\n onClick={() => this.handleOverlayClick()}\n ></div>\n <div\n data-focus-trap-edge\n onFocus={this.handleTopFocus}\n tabindex=\"0\"\n ></div>\n <div\n class={`modal-content-container ${this.size}`}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={this.caption}>\n {isAlertVariant ? (\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\n </div>\n ) : null}\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-caption\">{this.caption}</h2>\n { \n this.showCloseButton && \n <ifx-icon-button class = 'modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON') }>\n </ifx-icon-button>\n }\n </div>\n <div class=\"modal-body\">\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\n </div>\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\n <slot name=\"buttons\" onSlotchange={(e)=>this.handleButtonsSlotChange(e)}>\n </slot>\n </div>\n </div>\n </div>\n <div\n data-focus-trap-edge\n onFocus={this.handleBottomFocus}\n tabindex=\"0\"\n ></div>\n </div>\n </Host>\n\n );\n }\n}"]}
@@ -25,11 +25,6 @@ export class Table {
25
25
  this.variant = 'default';
26
26
  this.showLoading = false;
27
27
  this.originalRowData = [];
28
- this.itemsPerPage = JSON.stringify([
29
- { value: 10, label: '10', selected: true },
30
- { value: 20, label: '20', selected: false },
31
- { value: 30, label: '30', selected: false }
32
- ]);
33
28
  }
34
29
  handleChipChange(event) {
35
30
  const { name, currentSelection, previousSelection } = event.detail;
@@ -367,12 +362,12 @@ export class Table {
367
362
  };
368
363
  }
369
364
  const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';
370
- return (h(Host, { key: 'ab4330b9425fdb169007392236918d8b350fc17d' }, h("div", { key: 'e24a70d949fac201bdfa4aa18a524ac9bcf7d197', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '986ffe8eba8003a159835b27b71eab34969e0fc7', class: "sidebar-btn" }, h("ifx-button", { key: '6a171543107c204f70c3c88b86510aadbd8b0277', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '311fb3701889e2ac535266e935d430c19a1a3b23', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: '4e22f2d2d520cfbb857362433bae12f5221c2d6e', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '229bf84bbccd90ff502908b8c0f11e2c13b5a2eb', class: "sidebar-container" }, h("div", { key: '58672767e689b3a4b905ddbfbe4c7af56e3d3ad4', class: "filters-title-container" }, h("span", { key: '5a77ad2d85f51d880d9f541f04b83d001b17dd7a', class: "filters-title" }, "Filters")), h("div", { key: 'bf77cc0cfb917c67dc610190b2b0cea7c8a9de59', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '76b196f4638bccea8958c66de09983ef14dce2a5', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '936e7af7043d32e3aa3fdeb8018ade677d28903b', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '43c0f00b9634ef4449e301fbf0d4c6f3f075381f', name: "topbar-filter" })))), h("div", { key: '44aa129865488ae679716a9dcfce37ed51b3f11f', class: "table-pagination-wrapper" }, h("div", { key: 'e9ea60059fac694381efad7a7bc29dc3fd12df1c', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
365
+ return (h(Host, { key: '6f2bbbf0f6f54b121923a987032ac954a109d836' }, h("div", { key: '3bffc08c1f4a2e8088e37615323a58e4fa2b32a6', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: 'bdbc7badd8eeb7f29c5914badf7804153b792855', class: "sidebar-btn" }, h("ifx-button", { key: '31b78635d92061fdbc71ac433e293ead16c926c6', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '61963cb69d3ced50a1451d6fa1342c80b885e634', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'c20c2395ecd3bd147d27971341b4f6c7f95faf5c', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '90e0cf0773c9c482e348c9e0ad3859aec327f06d', class: "sidebar-container" }, h("div", { key: 'aa990307d66c22681d40165825bfc6f5a0320903', class: "filters-title-container" }, h("span", { key: '84584bfd511e62c13418d4ac985d46aed9b4bb51', class: "filters-title" }, "Filters")), h("div", { key: 'af9f92cb7ec2bd4b85dcc0d0b2829f1632420bc7', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '52e2be083146f57f786bcd563beffabddd6a83e5', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: 'a7979d6fd338ea344027c30109a7a011dc56406d', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '2485a88a51175c2799ab904784d77ffc940b91b5', name: "topbar-filter" })))), h("div", { key: '31d196ac4eaeec4b255a351f62de157325129b6a', class: "table-pagination-wrapper" }, h("div", { key: '0744dd597b97e2aac23b3e8526dae4a39ac8c9f2', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
371
366
  const filter = this.currentFilters[name];
372
367
  const filterValues = filter.filterValues;
373
368
  const isMultiSelect = filter.type !== 'text';
374
369
  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;
375
- })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: 'f24fa444fd4120d2a96c53ba9c16ac6d0ccc1c08', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: 'f4e10a36aac03fe66df8f3fc989b6820ceca03d7', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: 'd49cd5dc37c9cc4de3b5d196150c095521035fcb', class: "matching-results-container" }, h("span", { key: '02dca2f15819680478f3533eaec522ebb77679c1', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '6841b1790a4e3ea0bf33513a3baefaec85740e56', class: "matching-results-text" }, "matching results"))), h("div", { key: '4979f6f00189dcdddcb1f978e822ce9297894375', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '54e2dd3b25e78513aa4d4809d8c5221d7bb0e6a8', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }) : null)))));
370
+ })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '81f1978647c926fb56ce373e5404c710367e1be9', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '574f01906007d6aa46067ec5d48dd372e0fbaab7', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '6f44b6711af0603388b89023013636c0dfbfabbf', class: "matching-results-container" }, h("span", { key: 'ae2104db83897ce4c372e8b5c545e1020614de88', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '7d1718e0694c78e183f291587347e6a895b3b9e8', class: "matching-results-text" }, "matching results"))), h("div", { key: '5323155a4b544e73035e97c3666946a8ca376be5', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '38ca8150996e3fe8e3c9a1766eef189dded2acf1', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage, "items-per-page": '[{"value":"ten","label":"10","selected":true}, {"value":"Twenty","label":"20","selected":false}, {"value":"Thirty","label":"30","selected":false}]' }) : null)))));
376
371
  }
377
372
  hasButtonCol() {
378
373
  return this.getColData().some(column => column.field === 'button');
@@ -1 +1 @@
1
- {"version":3,"file":"table.js","sourceRoot":"","sources":["../../../src/components/table-advanced-version/table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Host, Method, Element, Prop, State, Listen, Watch } from '@stencil/core';\nimport classNames from 'classnames';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { createGrid, FirstDataRenderedEvent, GridApi, GridOptions } from 'ag-grid-community';\nimport { ButtonCellRenderer } from './buttonCellRenderer';\nimport { CustomNoRowsOverlay } from './customNoRowsOverlay';\nimport { CustomLoadingOverlay } from './customLoadingOverlay';\n\n\n@Component({\n tag: 'ifx-table',\n styleUrl: 'table.scss',\n shadow: true\n})\nexport class Table {\n gridOptions: GridOptions;\n gridApi: GridApi;\n @State() currentPage: number = 1;\n @Prop() cols: any;\n @Prop() rows: any;\n @Prop() buttonRendererOptions?: { onButtonClick?: (params: any, event: Event) => void;}; \n @State() rowData: any[] = [];\n @State() colData: any[] = [];\n @State() filterOptions: { [key: string]: string[] } = {};\n @State() currentFilters = {};\n @State() uniqueKey: string;\n allRowData: any[] = [];\n @Prop() rowHeight: string = 'default';\n @Prop() tableHeight: string = 'auto';\n @Prop() pagination: boolean = true;\n @Prop() paginationPageSize: number = 10;\n @Prop() filterOrientation: string = 'sidebar'; // topbar / none\n @State() showSidebarFilters: boolean = true;\n @State() matchingResultsCount: number = 0;\n @Prop() variant: string = 'default'\n\n @Prop() showLoading: boolean = false;\n private container: HTMLDivElement;\n @Element() host: HTMLElement;\n originalRowData: any[] = [];\n\n private itemsPerPage = JSON.stringify([\n { value: 10, label: '10', selected: true },\n { value: 20, label: '20', selected: false },\n { value: 30, label: '30', selected: false }\n ]); \n\n @Listen('ifxChange')\n handleChipChange(event: CustomEvent<{ previousSelection: Array<any>, currentSelection: Array<any>, name: string }>) {\n const { name, currentSelection, previousSelection } = event.detail;\n if(currentSelection && previousSelection) { \n // Clone the current filters state\n const updatedFilters = { ...this.currentFilters };\n \n if (currentSelection.length === 0) {\n // If there are no selections for this filter, delete the filter\n delete updatedFilters[name];\n \n // Emit event with specific filter name\n const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });\n this.host.dispatchEvent(customEvent);\n } else {\n // Otherwise, update the filter values with the current selection\n updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);\n }\n \n // Update the component's filters\n this.currentFilters = updatedFilters;\n \n // Ensure table data is updated\n this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n this.updateTableView();\n }\n }\n\n @Watch('buttonRendererOptions')\n onButtonRendererOptionsChanged() {\n this.colData = this.getColData(); // Re-fetch column data to apply new renderer options\n if (this.gridApi) {\n this.gridApi.setColumnDefs(this.colData); // Update column definitions in the grid API\n }\n }\n\n toggleSidebarFilters() {\n this.showSidebarFilters = !this.showSidebarFilters;\n }\n\n updateFilterOptions() {\n const options = {};\n for (let col of this.colData) {\n options[col.field] = [...new Set(this.rowData.map(row => row[col.field]))];\n }\n this.filterOptions = options;\n }\n\n handleSidebarFilterChange(event: CustomEvent) {\n const filterGroups = event.detail;\n const updatedFilters = {};\n\n filterGroups.forEach(filterGroup => {\n const filterName = filterGroup.filterGroupName;\n let filterValues;\n let type;\n\n if (filterGroup.selectedItems && filterGroup.selectedItems.length > 0) {\n filterValues = filterGroup.selectedItems.map(item => item.label);\n type = 'multi-select';\n } else if (filterGroup.value) {\n filterValues = [filterGroup.value];\n type = 'text';\n } else {\n filterValues = [];\n }\n\n if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n updatedFilters[filterName] = { filterValues, type };\n }\n });\n\n this.allRowData = this.applyAllFilters(this.originalRowData, updatedFilters);\n this.updateTableView();\n this.currentFilters = updatedFilters;\n }\n\n\n handleTopbarFilterChange(event: CustomEvent) {\n const filters = event.detail;\n\n // Start by resetting the filter conditions to a blank object\n this.currentFilters = {};\n\n // Loop through each filter group provided in the event detail\n filters.forEach(filter => {\n const filterName = filter.filterName;\n let filterValues;\n\n let type = filter.type;\n\n if (type === 'text') {\n // Search/Text filter\n filterValues = filter.filterValues\n } else {\n // Multi-select/Single-Select\n filterValues = filter.filterValues.map(item => item.label);\n }\n\n // If there are no filter values, or the filter is a text filter with an empty value, remove the filter\n if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n // Add or update the filter in the currentFilters object\n this.currentFilters[filterName] = { filterValues, type };\n }\n });\n\n\n // Now that the currentFilters object has been updated, apply all filters to the data\n this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n\n // After filtering, update the table view with the new filtered data\n this.updateTableView();\n }\n\n\n applyAllFilters(data, filters) {\n return data.filter(row => {\n for (const filterName in filters) {\n const filterInfo = filters[filterName];\n let selectedValues = (filterInfo.filterValues || []).map(value => {\n if (typeof value === 'string') {\n return value.toLowerCase();\n } else if (typeof value === 'number' || typeof value === 'boolean') {\n return value.toString();\n }\n return '';\n });\n\n // For text filters, check if row values start with any of the selectedValues\n if (filterInfo.type === 'text') {\n let textFilterMatched = false;\n for (let property in row) {\n if (row.hasOwnProperty(property)) {\n let rowValue = row[property] != null ? String(row[property]).toLowerCase() : '';\n if (selectedValues.some(filterValue => rowValue.startsWith(filterValue))) {\n textFilterMatched = true;\n break;\n }\n }\n }\n if (!textFilterMatched) return false;\n }\n // For multi-select filters, this remains unchanged\n else if (filterInfo.type === 'multi-select') {\n let rowValue = row[filterName] != null ? String(row[filterName]).toLowerCase() : '';\n // Check if 'undefined' is a selected value and include rows with empty values in that case\n let includesUndefined = selectedValues.includes('undefined');\n if (!selectedValues.includes(rowValue) && !(includesUndefined && rowValue === '')) {\n return false;\n }\n }\n }\n return true;\n });\n }\n\n\n\n updateTableView() {\n // Calculate the slice of data to display based on pagination\n const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n const endIndex = startIndex + this.paginationPageSize;\n const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n\n // Update the row data in the table\n this.rowData = visibleRowData;\n this.gridApi.setGridOption('rowData', this.rowData);\n\n // Update matching results count\n this.matchingResultsCount = this.allRowData.length;\n }\n\n\n clearAllFilters() {\n this.currentFilters = {};\n this.allRowData = [...this.originalRowData];\n }\n\n\n @Method()\n async onBtShowLoading() {\n this.gridApi.showLoadingOverlay();\n }\n\n componentWillLoad() {\n this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;\n this.rowData = this.getRowData();\n this.colData = this.getColData();\n this.updateFilterOptions();\n\n this.gridOptions = {\n\n rowHeight: this.rowHeight === 'default' ? 40 : 32,\n headerHeight: 40,\n defaultColDef: {\n resizable: true,\n },\n suppressDragLeaveHidesColumns: true,\n enableCellTextSelection: true,\n onFirstDataRendered: this.onFirstDataRendered.bind(this),\n columnDefs: this.colData,\n rowData: this.rowData,\n loadingOverlayComponent: CustomLoadingOverlay,\n noRowsOverlayComponent: CustomNoRowsOverlay,\n noRowsOverlayComponentParams: {\n noRowsMessageFunc: () =>\n 'No rows found' //at: ' + new Date().toLocaleTimeString(),\n },\n icons: {\n sortAscending: '<ifx-icon icon=\"arrow-triangle-up-16\"></ifx-icon>',\n sortDescending: '<ifx-icon icon=\"arrow-triangle-down-16\"></ifx-icon>',\n sortUnSort: '<a class=\"unsort-icon-custom-color\"><ifx-icon icon=\"arrow-triangle-vertikal-16\"></ifx-icon></a>'\n },\n rowDragManaged: this.colData.some(col => col.dndSource === true) ? true : false,\n animateRows: this.colData.some(col => col.dndSource === true) ? true : false,\n };\n\n }\n\n componentDidRender() {\n if (this.gridApi) {\n this.gridApi.setGridOption('columnDefs', this.colData);\n }\n }\n\n async componentDidLoad() {\n if (this.container) {\n if(!isNestedInIfxComponent(this.host)) { \n const framework = detectFramework();\n trackComponent('ifx-table', await framework)\n }\n this.gridApi = createGrid(this.container, this.gridOptions);\n if (this.gridApi) {\n this.gridApi.sizeColumnsToFit({\n defaultMinWidth: 100,\n });\n this.gridApi.setGridOption('columnDefs', this.colData);\n this.gridApi.setGridOption('rowData', this.rowData);\n\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.addEventListener('ifxPageChange', this.handlePageChange.bind(this));\n }\n }\n const sidebarFilterElements = this.host.querySelectorAll('ifx-filter-type-group');\n // Add an event listener to each SetFilter component\n sidebarFilterElements.forEach(sidebarFilterElement => {\n sidebarFilterElement.addEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n });\n const topbarFilterElements = this.host.querySelectorAll('ifx-filter-bar');\n // Add an event listener to each SetFilter component\n topbarFilterElements.forEach(topbarFilterElement => {\n topbarFilterElement.addEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n });\n }\n }\n }\n\n componentWillUnmount() {\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.removeEventListener('ifxPageChange', this.handlePageChange.bind(this));\n }\n }\n const sidebarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n // Remove the event listener from each SetFilter component\n sidebarFilters.forEach(sidebarFilter => {\n sidebarFilter.removeEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n });\n const topbarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n // Remove the event listener from each SetFilter component\n topbarFilters.forEach(topbarFilter => {\n topbarFilter.removeEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n });\n }\n\n handlePageChange(event) {\n this.currentPage = event.detail.currentPage;\n const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n const endIndex = startIndex + this.paginationPageSize;\n const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n // Update the data in the grid\n if (this.gridApi) {\n this.gridApi.setGridOption('rowData', visibleRowData);\n }\n }\n\n isJSONParseable(str) {\n try {\n JSON.parse(str);\n return true;\n } catch (e) {\n return false;\n }\n }\n\n\n getRowData() {\n let rows: any[] = [];\n if (this.rows === undefined || this.rows === null) {\n return rows;\n }\n \n if (this.isJSONParseable(this.rows)) {\n rows = [...JSON.parse(this.rows)];\n }\n else if (Array.isArray(this.rows) || typeof this.rows === 'object') {\n rows = [...this.rows];\n }\n else {\n console.error('Unexpected value for rows: ', this.rows);\n }\n\n this.allRowData = rows;\n this.originalRowData = [...rows]; // Deep copy the original data\n this.matchingResultsCount = this.allRowData.length;\n\n return rows.slice(0, this.paginationPageSize);\n }\n\n\n getColData() {\n let cols: any[] = [];\n if (this.cols === undefined || this.cols === null) {\n return cols;\n }\n \n if (this.isJSONParseable(this.cols)) {\n cols = [...JSON.parse(this.cols)];\n } else if (Array.isArray(this.cols) || typeof this.cols === 'object') {\n cols = [...this.cols];\n } else {\n console.error('Unexpected value for cols: ', this.cols);\n }\n \n const buttonColumn = cols.find(column => column.field === 'button');\n if (buttonColumn) {\n buttonColumn.cellRenderer = ButtonCellRenderer;\n buttonColumn.valueFormatter = params => params.value.text;\n \n // No JSON.parse needed now\n if (this.buttonRendererOptions && typeof this.buttonRendererOptions === 'object') {\n if (this.buttonRendererOptions.onButtonClick) {\n buttonColumn.cellRendererParams = {\n onButtonClick: this.buttonRendererOptions.onButtonClick\n };\n }\n }\n }\n \n return cols;\n }\n \n\n onFirstDataRendered(params: FirstDataRenderedEvent) {\n params.api.sizeColumnsToFit();\n }\n\n handleResetButtonClick() {\n const resetEvent = new CustomEvent('ifxResetFiltersEvent', { bubbles: true, composed: true });\n window.dispatchEvent(resetEvent); // Dispatch from the window object\n\n this.clearAllFilters();\n this.updateTableView(); // Update table view with the original data\n }\n\n\n disconnectedCallback() {\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.removeEventListener('ifxPageChange', this.handlePageChange);\n }\n }\n\n const resetButton = this.host.shadowRoot.querySelector('#reset-filters-button');\n if (resetButton) {\n resetButton.removeEventListener('click', this.handleResetButtonClick.bind(this));\n }\n }\n\n\n\n getTableClassNames() {\n return classNames(\n this.tableHeight === 'auto' && 'table-wrapper ag-root-wrapper-body',\n 'table-wrapper',\n );\n }\n\n\n render() {\n let style = {};\n if (this.tableHeight !== 'auto') {\n style = {\n 'height': this.tableHeight\n };\n }\n const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';\n return (\n <Host>\n <div class=\"table-container\">\n {this.filterOrientation === 'sidebar' && (\n <div class=\"sidebar-btn\">\n <ifx-button\n type=\"button\"\n disabled={false}\n variant=\"secondary\"\n size=\"m\"\n target=\"_blank\"\n theme=\"default\"\n full-width=\"false\"\n onClick={() => this.toggleSidebarFilters()}\n >\n <ifx-icon icon=\"cross-16\"></ifx-icon>{this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'}\n </ifx-button>\n </div>\n )}\n\n <div class={filterClass}>\n {this.filterOrientation === 'sidebar' && this.showSidebarFilters && (\n <div class=\"sidebar-container\">\n <div class=\"filters-title-container\">\n <span class=\"filters-title\">Filters</span>\n </div>\n <div class=\"set-filter-wrapper-sidebar\">\n {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n <slot name=\"sidebar-filter\"></slot>\n )}\n </div>\n </div>\n )}\n\n {this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (\n <div class=\"set-filter-wrapper-topbar\">\n {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n <slot name=\"topbar-filter\"></slot>\n )}\n </div>\n )}\n\n <div class=\"table-pagination-wrapper\">\n <div class=\"filter-chips\">\n {this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (\n Object.keys(this.currentFilters).map(name => {\n const filter = this.currentFilters[name];\n const filterValues = filter.filterValues;\n const isMultiSelect = filter.type !== 'text';\n\n return filterValues.length > 0 ? (\n <ifx-chip\n placeholder={name}\n size=\"large\"\n variant={isMultiSelect ? \"multi\" : \"single\"}\n readOnly={true}\n value={filterValues} // Ensure value prop is set\n key={name}\n >\n {filterValues.map(filterValue => (\n <ifx-chip-item value={filterValue} selected={true} key={filterValue}>\n {filterValue}\n </ifx-chip-item>\n ))}\n </ifx-chip>\n ) : null;\n })\n )}\n\n {this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (\n <ifx-button type=\"button\" disabled={false} variant=\"tertiary\" size=\"m\" target=\"_blank\" theme=\"default\" full-width=\"false\" onClick={() => this.handleResetButtonClick()}\n >\n <ifx-icon icon=\"curved-arrow-left-16\"></ifx-icon>Reset all\n </ifx-button>\n )}\n </div>\n\n {this.filterOrientation !== 'none' && (\n <div class=\"matching-results-container\">\n <span class=\"matching-results-count\">\n {this.matchingResultsCount}\n </span>\n <span class=\"matching-results-text\">\n matching results\n </span>\n </div>\n )}\n\n <div id=\"table-wrapper\" class={this.getTableClassNames()}>\n <div id={`ifxTable-${this.uniqueKey}`} class={`ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : \"\"}`} style={style} ref={(el) => this.container = el}>\n </div>\n </div>\n {this.pagination ? <ifx-pagination total={this.allRowData.length} current-page={this.currentPage} items-per-page={this.itemsPerPage}></ifx-pagination> : null}\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n\n hasButtonCol(): boolean {\n return this.getColData().some(column => column.field === 'button');\n }\n\n onDragOver(event) {\n var dragSupported = event.dataTransfer.length;\n\n if (dragSupported) {\n event.dataTransfer.dropEffect = 'move';\n }\n\n event.preventDefault();\n }\n\n onDrop(event) {\n var jsonData = event.dataTransfer.getData('application/json');\n\n var eJsonRow = document.createElement('div');\n eJsonRow.classList.add('json-row');\n eJsonRow.innerText = jsonData;\n\n var eJsonDisplay = document.querySelector('#eJsonDisplay');\n\n eJsonDisplay.appendChild(eJsonRow);\n event.preventDefault();\n }\n\n}\n"]}
1
+ {"version":3,"file":"table.js","sourceRoot":"","sources":["../../../src/components/table-advanced-version/table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Host, Method, Element, Prop, State, Listen, Watch } from '@stencil/core';\nimport classNames from 'classnames';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { createGrid, FirstDataRenderedEvent, GridApi, GridOptions } from 'ag-grid-community';\nimport { ButtonCellRenderer } from './buttonCellRenderer';\nimport { CustomNoRowsOverlay } from './customNoRowsOverlay';\nimport { CustomLoadingOverlay } from './customLoadingOverlay';\n\n\n@Component({\n tag: 'ifx-table',\n styleUrl: 'table.scss',\n shadow: true\n})\nexport class Table {\n gridOptions: GridOptions;\n gridApi: GridApi;\n @State() currentPage: number = 1;\n @Prop() cols: any;\n @Prop() rows: any;\n @Prop() buttonRendererOptions?: { onButtonClick?: (params: any, event: Event) => void;}; \n @State() rowData: any[] = [];\n @State() colData: any[] = [];\n @State() filterOptions: { [key: string]: string[] } = {};\n @State() currentFilters = {};\n @State() uniqueKey: string;\n allRowData: any[] = [];\n @Prop() rowHeight: string = 'default';\n @Prop() tableHeight: string = 'auto';\n @Prop() pagination: boolean = true;\n @Prop() paginationPageSize: number = 10;\n @Prop() filterOrientation: string = 'sidebar'; // topbar / none\n @State() showSidebarFilters: boolean = true;\n @State() matchingResultsCount: number = 0;\n @Prop() variant: string = 'default'\n\n @Prop() showLoading: boolean = false;\n private container: HTMLDivElement;\n @Element() host: HTMLElement;\n originalRowData: any[] = [];\n\n @Listen('ifxChange')\n handleChipChange(event: CustomEvent<{ previousSelection: Array<any>, currentSelection: Array<any>, name: string }>) {\n const { name, currentSelection, previousSelection } = event.detail;\n if(currentSelection && previousSelection) { \n // Clone the current filters state\n const updatedFilters = { ...this.currentFilters };\n \n if (currentSelection.length === 0) {\n // If there are no selections for this filter, delete the filter\n delete updatedFilters[name];\n \n // Emit event with specific filter name\n const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });\n this.host.dispatchEvent(customEvent);\n } else {\n // Otherwise, update the filter values with the current selection\n updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);\n }\n \n // Update the component's filters\n this.currentFilters = updatedFilters;\n \n // Ensure table data is updated\n this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n this.updateTableView();\n }\n }\n\n @Watch('buttonRendererOptions')\n onButtonRendererOptionsChanged() {\n this.colData = this.getColData(); // Re-fetch column data to apply new renderer options\n if (this.gridApi) {\n this.gridApi.setColumnDefs(this.colData); // Update column definitions in the grid API\n }\n }\n\n toggleSidebarFilters() {\n this.showSidebarFilters = !this.showSidebarFilters;\n }\n\n updateFilterOptions() {\n const options = {};\n for (let col of this.colData) {\n options[col.field] = [...new Set(this.rowData.map(row => row[col.field]))];\n }\n this.filterOptions = options;\n }\n\n handleSidebarFilterChange(event: CustomEvent) {\n const filterGroups = event.detail;\n const updatedFilters = {};\n\n filterGroups.forEach(filterGroup => {\n const filterName = filterGroup.filterGroupName;\n let filterValues;\n let type;\n\n if (filterGroup.selectedItems && filterGroup.selectedItems.length > 0) {\n filterValues = filterGroup.selectedItems.map(item => item.label);\n type = 'multi-select';\n } else if (filterGroup.value) {\n filterValues = [filterGroup.value];\n type = 'text';\n } else {\n filterValues = [];\n }\n\n if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n updatedFilters[filterName] = { filterValues, type };\n }\n });\n\n this.allRowData = this.applyAllFilters(this.originalRowData, updatedFilters);\n this.updateTableView();\n this.currentFilters = updatedFilters;\n }\n\n\n handleTopbarFilterChange(event: CustomEvent) {\n const filters = event.detail;\n\n // Start by resetting the filter conditions to a blank object\n this.currentFilters = {};\n\n // Loop through each filter group provided in the event detail\n filters.forEach(filter => {\n const filterName = filter.filterName;\n let filterValues;\n\n let type = filter.type;\n\n if (type === 'text') {\n // Search/Text filter\n filterValues = filter.filterValues\n } else {\n // Multi-select/Single-Select\n filterValues = filter.filterValues.map(item => item.label);\n }\n\n // If there are no filter values, or the filter is a text filter with an empty value, remove the filter\n if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n // Add or update the filter in the currentFilters object\n this.currentFilters[filterName] = { filterValues, type };\n }\n });\n\n\n // Now that the currentFilters object has been updated, apply all filters to the data\n this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n\n // After filtering, update the table view with the new filtered data\n this.updateTableView();\n }\n\n\n applyAllFilters(data, filters) {\n return data.filter(row => {\n for (const filterName in filters) {\n const filterInfo = filters[filterName];\n let selectedValues = (filterInfo.filterValues || []).map(value => {\n if (typeof value === 'string') {\n return value.toLowerCase();\n } else if (typeof value === 'number' || typeof value === 'boolean') {\n return value.toString();\n }\n return '';\n });\n\n // For text filters, check if row values start with any of the selectedValues\n if (filterInfo.type === 'text') {\n let textFilterMatched = false;\n for (let property in row) {\n if (row.hasOwnProperty(property)) {\n let rowValue = row[property] != null ? String(row[property]).toLowerCase() : '';\n if (selectedValues.some(filterValue => rowValue.startsWith(filterValue))) {\n textFilterMatched = true;\n break;\n }\n }\n }\n if (!textFilterMatched) return false;\n }\n // For multi-select filters, this remains unchanged\n else if (filterInfo.type === 'multi-select') {\n let rowValue = row[filterName] != null ? String(row[filterName]).toLowerCase() : '';\n // Check if 'undefined' is a selected value and include rows with empty values in that case\n let includesUndefined = selectedValues.includes('undefined');\n if (!selectedValues.includes(rowValue) && !(includesUndefined && rowValue === '')) {\n return false;\n }\n }\n }\n return true;\n });\n }\n\n\n\n updateTableView() {\n // Calculate the slice of data to display based on pagination\n const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n const endIndex = startIndex + this.paginationPageSize;\n const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n\n // Update the row data in the table\n this.rowData = visibleRowData;\n this.gridApi.setGridOption('rowData', this.rowData);\n\n // Update matching results count\n this.matchingResultsCount = this.allRowData.length;\n }\n\n\n clearAllFilters() {\n this.currentFilters = {};\n this.allRowData = [...this.originalRowData];\n }\n\n\n @Method()\n async onBtShowLoading() {\n this.gridApi.showLoadingOverlay();\n }\n\n componentWillLoad() {\n this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;\n this.rowData = this.getRowData();\n this.colData = this.getColData();\n this.updateFilterOptions();\n\n this.gridOptions = {\n\n rowHeight: this.rowHeight === 'default' ? 40 : 32,\n headerHeight: 40,\n defaultColDef: {\n resizable: true,\n },\n suppressDragLeaveHidesColumns: true,\n enableCellTextSelection: true,\n onFirstDataRendered: this.onFirstDataRendered.bind(this),\n columnDefs: this.colData,\n rowData: this.rowData,\n loadingOverlayComponent: CustomLoadingOverlay,\n noRowsOverlayComponent: CustomNoRowsOverlay,\n noRowsOverlayComponentParams: {\n noRowsMessageFunc: () =>\n 'No rows found' //at: ' + new Date().toLocaleTimeString(),\n },\n icons: {\n sortAscending: '<ifx-icon icon=\"arrow-triangle-up-16\"></ifx-icon>',\n sortDescending: '<ifx-icon icon=\"arrow-triangle-down-16\"></ifx-icon>',\n sortUnSort: '<a class=\"unsort-icon-custom-color\"><ifx-icon icon=\"arrow-triangle-vertikal-16\"></ifx-icon></a>'\n },\n rowDragManaged: this.colData.some(col => col.dndSource === true) ? true : false,\n animateRows: this.colData.some(col => col.dndSource === true) ? true : false,\n };\n\n }\n\n componentDidRender() {\n if (this.gridApi) {\n this.gridApi.setGridOption('columnDefs', this.colData);\n }\n }\n\n async componentDidLoad() {\n if (this.container) {\n if(!isNestedInIfxComponent(this.host)) { \n const framework = detectFramework();\n trackComponent('ifx-table', await framework)\n }\n this.gridApi = createGrid(this.container, this.gridOptions);\n if (this.gridApi) {\n this.gridApi.sizeColumnsToFit({\n defaultMinWidth: 100,\n });\n this.gridApi.setGridOption('columnDefs', this.colData);\n this.gridApi.setGridOption('rowData', this.rowData);\n\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.addEventListener('ifxPageChange', this.handlePageChange.bind(this));\n }\n }\n const sidebarFilterElements = this.host.querySelectorAll('ifx-filter-type-group');\n // Add an event listener to each SetFilter component\n sidebarFilterElements.forEach(sidebarFilterElement => {\n sidebarFilterElement.addEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n });\n const topbarFilterElements = this.host.querySelectorAll('ifx-filter-bar');\n // Add an event listener to each SetFilter component\n topbarFilterElements.forEach(topbarFilterElement => {\n topbarFilterElement.addEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n });\n }\n }\n }\n\n componentWillUnmount() {\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.removeEventListener('ifxPageChange', this.handlePageChange.bind(this));\n }\n }\n const sidebarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n // Remove the event listener from each SetFilter component\n sidebarFilters.forEach(sidebarFilter => {\n sidebarFilter.removeEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n });\n const topbarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n // Remove the event listener from each SetFilter component\n topbarFilters.forEach(topbarFilter => {\n topbarFilter.removeEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n });\n }\n\n handlePageChange(event) {\n this.currentPage = event.detail.currentPage;\n const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n const endIndex = startIndex + this.paginationPageSize;\n const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n // Update the data in the grid\n if (this.gridApi) {\n this.gridApi.setGridOption('rowData', visibleRowData);\n }\n }\n\n isJSONParseable(str) {\n try {\n JSON.parse(str);\n return true;\n } catch (e) {\n return false;\n }\n }\n\n\n getRowData() {\n let rows: any[] = [];\n if (this.rows === undefined || this.rows === null) {\n return rows;\n }\n \n if (this.isJSONParseable(this.rows)) {\n rows = [...JSON.parse(this.rows)];\n }\n else if (Array.isArray(this.rows) || typeof this.rows === 'object') {\n rows = [...this.rows];\n }\n else {\n console.error('Unexpected value for rows: ', this.rows);\n }\n\n this.allRowData = rows;\n this.originalRowData = [...rows]; // Deep copy the original data\n this.matchingResultsCount = this.allRowData.length;\n\n return rows.slice(0, this.paginationPageSize);\n }\n\n\n getColData() {\n let cols: any[] = [];\n if (this.cols === undefined || this.cols === null) {\n return cols;\n }\n \n if (this.isJSONParseable(this.cols)) {\n cols = [...JSON.parse(this.cols)];\n } else if (Array.isArray(this.cols) || typeof this.cols === 'object') {\n cols = [...this.cols];\n } else {\n console.error('Unexpected value for cols: ', this.cols);\n }\n \n const buttonColumn = cols.find(column => column.field === 'button');\n if (buttonColumn) {\n buttonColumn.cellRenderer = ButtonCellRenderer;\n buttonColumn.valueFormatter = params => params.value.text;\n \n // No JSON.parse needed now\n if (this.buttonRendererOptions && typeof this.buttonRendererOptions === 'object') {\n if (this.buttonRendererOptions.onButtonClick) {\n buttonColumn.cellRendererParams = {\n onButtonClick: this.buttonRendererOptions.onButtonClick\n };\n }\n }\n }\n \n return cols;\n }\n \n\n onFirstDataRendered(params: FirstDataRenderedEvent) {\n params.api.sizeColumnsToFit();\n }\n\n handleResetButtonClick() {\n const resetEvent = new CustomEvent('ifxResetFiltersEvent', { bubbles: true, composed: true });\n window.dispatchEvent(resetEvent); // Dispatch from the window object\n\n this.clearAllFilters();\n this.updateTableView(); // Update table view with the original data\n }\n\n\n disconnectedCallback() {\n if (this.pagination) {\n const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n if (paginationElement) {\n paginationElement.removeEventListener('ifxPageChange', this.handlePageChange);\n }\n }\n\n const resetButton = this.host.shadowRoot.querySelector('#reset-filters-button');\n if (resetButton) {\n resetButton.removeEventListener('click', this.handleResetButtonClick.bind(this));\n }\n }\n\n\n\n getTableClassNames() {\n return classNames(\n this.tableHeight === 'auto' && 'table-wrapper ag-root-wrapper-body',\n 'table-wrapper',\n );\n }\n\n\n render() {\n let style = {};\n if (this.tableHeight !== 'auto') {\n style = {\n 'height': this.tableHeight\n };\n }\n const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';\n return (\n <Host>\n <div class=\"table-container\">\n {this.filterOrientation === 'sidebar' && (\n <div class=\"sidebar-btn\">\n <ifx-button\n type=\"button\"\n disabled={false}\n variant=\"secondary\"\n size=\"m\"\n target=\"_blank\"\n theme=\"default\"\n full-width=\"false\"\n onClick={() => this.toggleSidebarFilters()}\n >\n <ifx-icon icon=\"cross-16\"></ifx-icon>{this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'}\n </ifx-button>\n </div>\n )}\n\n <div class={filterClass}>\n {this.filterOrientation === 'sidebar' && this.showSidebarFilters && (\n <div class=\"sidebar-container\">\n <div class=\"filters-title-container\">\n <span class=\"filters-title\">Filters</span>\n </div>\n <div class=\"set-filter-wrapper-sidebar\">\n {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n <slot name=\"sidebar-filter\"></slot>\n )}\n </div>\n </div>\n )}\n\n {this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (\n <div class=\"set-filter-wrapper-topbar\">\n {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n <slot name=\"topbar-filter\"></slot>\n )}\n </div>\n )}\n\n <div class=\"table-pagination-wrapper\">\n <div class=\"filter-chips\">\n {this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (\n Object.keys(this.currentFilters).map(name => {\n const filter = this.currentFilters[name];\n const filterValues = filter.filterValues;\n const isMultiSelect = filter.type !== 'text';\n\n return filterValues.length > 0 ? (\n <ifx-chip\n placeholder={name}\n size=\"large\"\n variant={isMultiSelect ? \"multi\" : \"single\"}\n readOnly={true}\n value={filterValues} // Ensure value prop is set\n key={name}\n >\n {filterValues.map(filterValue => (\n <ifx-chip-item value={filterValue} selected={true} key={filterValue}>\n {filterValue}\n </ifx-chip-item>\n ))}\n </ifx-chip>\n ) : null;\n })\n )}\n\n {this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (\n <ifx-button type=\"button\" disabled={false} variant=\"tertiary\" size=\"m\" target=\"_blank\" theme=\"default\" full-width=\"false\" onClick={() => this.handleResetButtonClick()}\n >\n <ifx-icon icon=\"curved-arrow-left-16\"></ifx-icon>Reset all\n </ifx-button>\n )}\n </div>\n\n {this.filterOrientation !== 'none' && (\n <div class=\"matching-results-container\">\n <span class=\"matching-results-count\">\n {this.matchingResultsCount}\n </span>\n <span class=\"matching-results-text\">\n matching results\n </span>\n </div>\n )}\n\n <div id=\"table-wrapper\" class={this.getTableClassNames()}>\n <div id={`ifxTable-${this.uniqueKey}`} class={`ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : \"\"}`} style={style} ref={(el) => this.container = el}>\n </div>\n </div>\n {this.pagination ? <ifx-pagination total={this.allRowData.length} current-page={this.currentPage} items-per-page='[{\"value\":\"ten\",\"label\":\"10\",\"selected\":true}, {\"value\":\"Twenty\",\"label\":\"20\",\"selected\":false}, {\"value\":\"Thirty\",\"label\":\"30\",\"selected\":false}]'></ifx-pagination> : null}\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n\n hasButtonCol(): boolean {\n return this.getColData().some(column => column.field === 'button');\n }\n\n onDragOver(event) {\n var dragSupported = event.dataTransfer.length;\n\n if (dragSupported) {\n event.dataTransfer.dropEffect = 'move';\n }\n\n event.preventDefault();\n }\n\n onDrop(event) {\n var jsonData = event.dataTransfer.getData('application/json');\n\n var eJsonRow = document.createElement('div');\n eJsonRow.classList.add('json-row');\n eJsonRow.innerText = jsonData;\n\n var eJsonDisplay = document.querySelector('#eJsonDisplay');\n\n eJsonDisplay.appendChild(eJsonRow);\n event.preventDefault();\n }\n\n}\n"]}
@@ -170,6 +170,14 @@ const IfxModal$1 = /*@__PURE__*/ proxyCustomElement(class IfxModal extends H {
170
170
  this.slotButtonsPresent = false;
171
171
  this.showCloseButton = true;
172
172
  this.focusableElements = [];
173
+ this.handleResize = () => {
174
+ clearTimeout(this.resizeTimeout);
175
+ this.resizeTimeout = setTimeout(() => {
176
+ if (this.showModal) {
177
+ this.handleComponentOverflow();
178
+ }
179
+ }, 100);
180
+ };
173
181
  this.handleTopFocus = () => {
174
182
  this.attemptFocus(this.getLastFocusableElement());
175
183
  };
@@ -193,15 +201,19 @@ const IfxModal$1 = /*@__PURE__*/ proxyCustomElement(class IfxModal extends H {
193
201
  // Query all focusable elements and store them in `focusableElements`.
194
202
  // Needed for the "focus trap" functionality.
195
203
  this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, (el) => isHidden(el) || el.matches('[data-focus-trap-edge]'), isFocusable);
204
+ window.addEventListener('resize', this.handleResize);
205
+ }
206
+ disconnectedCallback() {
207
+ window.removeEventListener('resize', this.handleResize);
196
208
  }
197
209
  componentWillRender() {
198
210
  if (this.showModal) {
199
211
  this.handleComponentOverflow();
200
212
  }
201
213
  }
202
- handleComponentOverflow() {
214
+ async handleComponentOverflow() {
203
215
  const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');
204
- if (this.showModal && this.isModalContentContainerHeightReachedViewport()) {
216
+ if (this.showModal && await this.isModalContentContainerHeightReachedViewport()) {
205
217
  modalContentContainer.classList.add('no-overflow');
206
218
  }
207
219
  else if (modalContentContainer === null || modalContentContainer === void 0 ? void 0 : modalContentContainer.classList.contains('no-overflow')) {
@@ -323,14 +335,15 @@ const IfxModal$1 = /*@__PURE__*/ proxyCustomElement(class IfxModal extends H {
323
335
  const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content');
324
336
  const modalContentHeight = modalContent.offsetHeight;
325
337
  const viewportHeight = window.innerHeight;
326
- resolve(modalContentHeight >= viewportHeight * 0.9);
338
+ const extraMarginForEdgeBrowser = 3;
339
+ resolve(modalContentHeight + extraMarginForEdgeBrowser >= viewportHeight * 0.9);
327
340
  }, 100);
328
341
  });
329
342
  }
330
343
  render() {
331
344
  const isAlertVariant = this.variant !== 'default';
332
- return (h(Host, { key: '0d573f93f0188f8255994ebd1f4355d0007d081e' }, h("div", { key: '2909db24603f28a307a3d2f88b9df3f1cc496ef3', ref: (el) => (this.modalContainer = el), class: `modal-container ${this.showModal ? 'open' : ''}` }, h("div", { key: 'bc8994163ac10cc94fbf553bee4590e75cd94c9f', class: "modal-overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: '4c978da70c5de23b0f05396a29a8a7d77a998fac', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), h("div", { key: '45d00c0226bfaf81f076e9fe99c967b10a24f6e5', class: `modal-content-container ${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, isAlertVariant ? (h("div", { class: `modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}` }, this.alertIcon ? h("ifx-icon", { icon: this.alertIcon }) : null)) : null, h("div", { key: '3db82f776b5ea0551a28b941a14812ddddf99a60', class: "modal-content" }, h("div", { key: 'f471b0e9429d3ee696a5921b201fe582ca5d94b5', class: "modal-header" }, h("h2", { key: '5ea3807496762c5c99f5c8ee86f3d13b5a96b3b2', class: "modal-caption" }, this.caption), this.showCloseButton &&
333
- h("ifx-icon-button", { key: 'f725cab8121fa8caf5f3d61925d521a8935864d6', class: 'modal-close-button', ref: (el) => (this.closeButton = el), icon: "cross-16", variant: "tertiary", onClick: () => this.doBeforeClose('CLOSE_BUTTON') })), h("div", { key: '7c05913f69feb6ea5e7cc6957f1e051bd0dc1278', class: "modal-body" }, h("slot", { key: '674d48b6361b1eece2bb4efd337d8ff1543e3c12', name: "content", onSlotchange: (e) => this.handleContentUpdate(e) })), h("div", { key: '13680bcdc4115d945653aa606fda3f6d80cfa94f', class: `modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}` }, h("slot", { key: 'de1f6c2c4ad5f3d36b68d825ba914784b271a6c6', name: "buttons", onSlotchange: (e) => this.handleButtonsSlotChange(e) })))), h("div", { key: '373cf96a9d6a8783440bbff74fcd60d02f8884cc', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
345
+ return (h(Host, { key: '7f2ee7c9eeab79a6adea9ce953338557409ee63c' }, h("div", { key: '570aaf330321ce620e4cd81bd30f70fbda554764', ref: (el) => (this.modalContainer = el), class: `modal-container ${this.showModal ? 'open' : ''}` }, h("div", { key: 'f56bc3b55b1c5cad207826bec0c733ba716b8af8', class: "modal-overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: 'dbabada0c836cb96d6b377381d6a733eef3c71ca', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), h("div", { key: '101f11d47db5b9a740861b6b7a096b25fb859b56', class: `modal-content-container ${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, isAlertVariant ? (h("div", { class: `modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}` }, this.alertIcon ? h("ifx-icon", { icon: this.alertIcon }) : null)) : null, h("div", { key: 'ef157335f204d270ead9cb97f2134d1241ee6ab9', class: "modal-content" }, h("div", { key: '6c270e7d5620125b0781409de8be3338211075c1', class: "modal-header" }, h("h2", { key: 'c30267d62020e7f6fdf585ea58a304a55447b98d', class: "modal-caption" }, this.caption), this.showCloseButton &&
346
+ h("ifx-icon-button", { key: '97c190da3029f4d27b5b20e570c48f80f7133db4', class: 'modal-close-button', ref: (el) => (this.closeButton = el), icon: "cross-16", variant: "tertiary", onClick: () => this.doBeforeClose('CLOSE_BUTTON') })), h("div", { key: 'a9d01d8b12b4634a4e9389fa4a31cb0b57a70654', class: "modal-body" }, h("slot", { key: 'c1119d0a4f278c7c10e1d85f72883f1db476b548', name: "content", onSlotchange: (e) => this.handleContentUpdate(e) })), h("div", { key: '1fe8397a7eb7f555a29f5821fe53d1c2342d3baa', class: `modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}` }, h("slot", { key: '67ad12ef2d9a477c2c2457350a93c0963a149d89', name: "buttons", onSlotchange: (e) => this.handleButtonsSlotChange(e) })))), h("div", { key: '35abe642c85dbdd4ec9bc5f78e7b24f1535fba22', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
334
347
  }
335
348
  get hostElement() { return this; }
336
349
  static get watchers() { return {
@@ -1 +1 @@
1
- {"file":"ifx-modal.js","mappings":"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","names":["IfxModal"],"sources":["src/global/utils/focus-trap.ts","src/global/utils/animation.ts","src/components/modal/modal.scss?tag=ifx-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["/**\n * Copy/pasted from https://github.com/andreasbm/focus-trap\n */\n\n/**\n * Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"*\")\n * the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot | HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n */\nexport function queryShadowRoot(\n root: ShadowRoot | HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot\n .assignedNodes()\n .filter((node) => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot(\n $slotParent,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n );\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children || []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(\n ...queryShadowRoot(\n $child.shadowRoot,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n )\n );\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(\n ...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1)\n );\n }\n }\n\n return matches;\n}\n\n/**\n * Returns whether the element is hidden.\n * @param $elem\n */\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') ||\n ($elem.hasAttribute('aria-hidden') &&\n $elem.getAttribute('aria-hidden') !== 'false') ||\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` ||\n $elem.style.opacity === `0` ||\n $elem.style.visibility === `hidden` ||\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // || $elem.offsetParent == null;\n}\n\n/**\n * Returns whether the element is disabled.\n * @param $elem\n */\nexport function isDisabled($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('disabled') ||\n ($elem.hasAttribute('aria-disabled') &&\n $elem.getAttribute('aria-disabled') !== 'false')\n );\n}\n\n/**\n * Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n */\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if (\n $elem.getAttribute('tabindex') === '-1' ||\n isHidden($elem) ||\n isDisabled($elem)\n ) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') ||\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement || $elem instanceof HTMLAreaElement) &&\n $elem.hasAttribute('href')) ||\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement ||\n $elem instanceof HTMLInputElement ||\n $elem instanceof HTMLTextAreaElement ||\n $elem instanceof HTMLSelectElement ||\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}","export function animationTo(\n element: HTMLElement,\n keyframes: Keyframe | Keyframe[],\n options?: KeyframeAnimationOptions\n) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.modal-container {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n}\n\n.modal-container.open {\n display: flex;\n}\n\n.modal-overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: tokens.$ifxColorBaseBlack;\n opacity: 0.5;\n z-index: 0;\n}\n\n.modal-content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n min-height: 218px;\n background-color: #fff;\n border-radius: tokens.$ifxBorderRadiusNone;\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n \n //overflow: hidden;\n\n box-sizing: border-box;\n align-items: stretch;\n}\n\n.modal-content-container {\n &.no-overflow { \n overflow: hidden;\n & .modal-body { \n overflow-y: auto;\n }\n }\n}\n\n/* Add desktop size here */\n@media screen and (min-width: 768px) {\n .modal-content-container {\n width: 540px;\n min-height: 132px;\n\n &.m,\n &.l,\n &.s {\n width: 90%;\n }\n }\n}\n\n@media screen and (min-width: 1024px) {\n .modal-content-container {\n\n &.s {\n width: 47vw;\n }\n\n &.m {\n width: 63vw;\n }\n\n &.l {\n width: 80%;\n }\n }\n}\n\n.modal-content {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-height: 90vh;\n}\n\n.modal-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: tokens.$ifxColorOcean500;\n align-self: stretch;\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n & ifx-icon {\n color: tokens.$ifxColorBaseWhite;\n }\n}\n\n.modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n min-height: 76px;\n max-height: 105px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n.modal-caption {\n max-height: 56px;\n display: -webkit-box;\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical; \n}\n\n.modal-header h2 {\n margin: 0;\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeXl;\n line-height: 28px;\n}\n\n.modal-header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.modal-close-button {\n align-self: flex-start;\n margin-right: -8px;\n}\n\n.modal-body {\n padding: 16px 24px;\n min-height: 56px;\n box-sizing: border-box;\n flex: 1;\n \n //overflow-y: auto;\n}\n\n.modal-footer.buttons-present ::slotted(*){\n display: flex;\n justify-content: flex-end;\n gap: 16px;\n padding: 16px 24px 32px 16px\n}\n\n.modal-border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n\n &.primary {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.secondary {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.success {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.warning {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.orange {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.ocean {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.grey {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.grey-200 {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.red {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.green {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.berry {\n background-color: tokens.$ifxColorBerry500;\n }\n}","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\n \ntype CloseEventTrigger = 'CLOSE_BUTTON' | 'ESCAPE_KEY' | 'BACKDROP';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n@Component({\n tag: 'ifx-modal',\n styleUrl: 'modal.scss',\n shadow: true\n})\nexport class IfxModal {\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n @State() showModal: boolean = this.opened || false;\n\n @Prop() caption: string = 'Modal Title';\n @Prop() closeOnOverlayClick: boolean = true;\n\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n\n @Prop() variant: 'default' | 'alert-brand' | 'alert-danger' = 'default';\n \n @Prop() size: 's' | 'm' | 'l' = 's';\n\n @Prop() alertIcon: string = '';\n @Prop() okButtonLabel: string = 'OK';\n @Prop() cancelButtonLabel: string = 'Cancel';\n @Element() hostElement: HTMLElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLButtonElement | HTMLIfxIconButtonElement;\n\n async componentDidLoad() {\n if(!isNestedInIfxComponent(this.hostElement)) { \n const framework = detectFramework();\n trackComponent('ifx-modal', await framework)\n }\n // Query all focusable elements and store them in `focusableElements`.\n // Needed for the \"focus trap\" functionality.\n this.focusableElements = queryShadowRoot(\n this.hostElement.shadowRoot,\n (el) => isHidden(el) || el.matches('[data-focus-trap-edge]'),\n isFocusable\n );\n }\n\n componentWillRender() { \n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n\n handleComponentOverflow() { \n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\n if (this.showModal && this.isModalContentContainerHeightReachedViewport()) {\n modalContentContainer.classList.add('no-overflow')\n } else if(modalContentContainer?.classList.contains('no-overflow')) { \n modalContentContainer?.classList.remove('no-overflow')\n }\n }\n\n getFirstFocusableElement(): HTMLElement | null {\n return this.focusableElements[0];\n }\n\n getLastFocusableElement(): HTMLElement | null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n attemptFocus(element: HTMLElement | null) {\n if (element == null) {\n setTimeout(() => { //wait until DOM is fully loaded\n this.closeButton.focus();\n },);\n return;\n }\n\n setTimeout(() => { //wait until DOM is fully loaded\n element.focus();\n }, 0);\n }\n\n open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n // Setting focus on last item and removing immediately\n // so, on tab press first element is focused\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.ifxOpen.emit();\n });\n\n this.hostElement.addEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.ifxOpen.emit();\n }\n }\n\n close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.ifxClose.emit();\n });\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.showModal = false;\n this.ifxClose.emit();\n }\n }\n\n handleKeypress = (event: KeyboardEvent) => {\n if (!this.showModal) {\n return;\n }\n if (event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some((event) => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue) {\n if (newValue === true) {\n this.open();\n } else {\n this.close()\n }\n }\n\n handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP')\n }\n }\n\n handleContentUpdate(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n if(nodes.length > 0) {\n nodes.forEach(node => {\n if (node.observer) {\n node.observer.disconnect();\n delete node.observer;\n }\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n node.observer = observer;\n });\n } \n }\n\n handleButtonsSlotChange(e) {\n if(e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\n this.slotButtonsPresent = true;\n }else{\n this.slotButtonsPresent = false;\n }\n }\n\n isModalContentContainerHeightReachedViewport() {\n //Adding timeout for proper height detection on Edge browser\n return new Promise(resolve => {\n setTimeout(() => {\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\n const modalContentHeight = modalContent.offsetHeight;\n const viewportHeight = window.innerHeight;\n resolve(modalContentHeight >= viewportHeight * 0.9);\n }, 100);\n });\n}\n\n\n render() {\n const isAlertVariant = this.variant !== 'default';\n return (\n <Host>\n <div\n ref={(el) => (this.modalContainer = el)}\n class={`modal-container ${this.showModal ? 'open' : ''}`}\n >\n <div\n class=\"modal-overlay\"\n onClick={() => this.handleOverlayClick()}\n ></div>\n <div\n data-focus-trap-edge\n onFocus={this.handleTopFocus}\n tabindex=\"0\"\n ></div>\n <div\n class={`modal-content-container ${this.size}`}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={this.caption}>\n {isAlertVariant ? (\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\n </div>\n ) : null}\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-caption\">{this.caption}</h2>\n { \n this.showCloseButton && \n <ifx-icon-button class = 'modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON') }>\n </ifx-icon-button>\n }\n </div>\n <div class=\"modal-body\">\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\n </div>\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\n <slot name=\"buttons\" onSlotchange={(e)=>this.handleButtonsSlotChange(e)}>\n </slot>\n </div>\n </div>\n </div>\n <div\n data-focus-trap-edge\n onFocus={this.handleBottomFocus}\n tabindex=\"0\"\n ></div>\n </div>\n </Host>\n\n );\n }\n}"],"version":3}
1
+ {"file":"ifx-modal.js","mappings":"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","names":["IfxModal"],"sources":["src/global/utils/focus-trap.ts","src/global/utils/animation.ts","src/components/modal/modal.scss?tag=ifx-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["/**\n * Copy/pasted from https://github.com/andreasbm/focus-trap\n */\n\n/**\n * Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"*\")\n * the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot | HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n */\nexport function queryShadowRoot(\n root: ShadowRoot | HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot\n .assignedNodes()\n .filter((node) => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot(\n $slotParent,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n );\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children || []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(\n ...queryShadowRoot(\n $child.shadowRoot,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n )\n );\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(\n ...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1)\n );\n }\n }\n\n return matches;\n}\n\n/**\n * Returns whether the element is hidden.\n * @param $elem\n */\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') ||\n ($elem.hasAttribute('aria-hidden') &&\n $elem.getAttribute('aria-hidden') !== 'false') ||\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` ||\n $elem.style.opacity === `0` ||\n $elem.style.visibility === `hidden` ||\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // || $elem.offsetParent == null;\n}\n\n/**\n * Returns whether the element is disabled.\n * @param $elem\n */\nexport function isDisabled($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('disabled') ||\n ($elem.hasAttribute('aria-disabled') &&\n $elem.getAttribute('aria-disabled') !== 'false')\n );\n}\n\n/**\n * Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n */\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if (\n $elem.getAttribute('tabindex') === '-1' ||\n isHidden($elem) ||\n isDisabled($elem)\n ) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') ||\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement || $elem instanceof HTMLAreaElement) &&\n $elem.hasAttribute('href')) ||\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement ||\n $elem instanceof HTMLInputElement ||\n $elem instanceof HTMLTextAreaElement ||\n $elem instanceof HTMLSelectElement ||\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}","export function animationTo(\n element: HTMLElement,\n keyframes: Keyframe | Keyframe[],\n options?: KeyframeAnimationOptions\n) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.modal-container {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n}\n\n.modal-container.open {\n display: flex;\n}\n\n.modal-overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: tokens.$ifxColorBaseBlack;\n opacity: 0.5;\n z-index: 0;\n}\n\n.modal-content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n min-height: 218px;\n background-color: #fff;\n border-radius: tokens.$ifxBorderRadiusNone;\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n \n //overflow: hidden;\n\n box-sizing: border-box;\n align-items: stretch;\n}\n\n.modal-content-container {\n &.no-overflow { \n overflow: hidden;\n & .modal-body { \n overflow-y: auto;\n }\n }\n}\n\n/* Add desktop size here */\n@media screen and (min-width: 768px) {\n .modal-content-container {\n width: 540px;\n min-height: 132px;\n\n &.m,\n &.l,\n &.s {\n width: 90%;\n }\n }\n}\n\n@media screen and (min-width: 1024px) {\n .modal-content-container {\n\n &.s {\n width: 47vw;\n }\n\n &.m {\n width: 63vw;\n }\n\n &.l {\n width: 80%;\n }\n }\n}\n\n.modal-content {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-height: 90vh;\n}\n\n.modal-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: tokens.$ifxColorOcean500;\n align-self: stretch;\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n & ifx-icon {\n color: tokens.$ifxColorBaseWhite;\n }\n}\n\n.modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n min-height: 76px;\n max-height: 105px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n.modal-caption {\n max-height: 56px;\n display: -webkit-box;\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical; \n}\n\n.modal-header h2 {\n margin: 0;\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeXl;\n line-height: 28px;\n}\n\n.modal-header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.modal-close-button {\n align-self: flex-start;\n margin-right: -8px;\n}\n\n.modal-body {\n padding: 16px 24px;\n min-height: 56px;\n box-sizing: border-box;\n flex: 1;\n \n //overflow-y: auto;\n}\n\n.modal-footer.buttons-present ::slotted(*){\n display: flex;\n justify-content: flex-end;\n gap: 16px;\n padding: 16px 24px 32px 16px\n}\n\n.modal-border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n\n &.primary {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.secondary {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.success {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.warning {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.orange {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.ocean {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.grey {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.grey-200 {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.red {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.green {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.berry {\n background-color: tokens.$ifxColorBerry500;\n }\n}","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\n \ntype CloseEventTrigger = 'CLOSE_BUTTON' | 'ESCAPE_KEY' | 'BACKDROP';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n@Component({\n tag: 'ifx-modal',\n styleUrl: 'modal.scss',\n shadow: true\n})\nexport class IfxModal {\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n @State() showModal: boolean = this.opened || false;\n\n @Prop() caption: string = 'Modal Title';\n @Prop() closeOnOverlayClick: boolean = true;\n\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n\n @Prop() variant: 'default' | 'alert-brand' | 'alert-danger' = 'default';\n \n @Prop() size: 's' | 'm' | 'l' = 's';\n\n @Prop() alertIcon: string = '';\n @Prop() okButtonLabel: string = 'OK';\n @Prop() cancelButtonLabel: string = 'Cancel';\n @Element() hostElement: HTMLElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLButtonElement | HTMLIfxIconButtonElement;\n private resizeTimeout: ReturnType<typeof setTimeout>;\n\n handleResize = () => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = setTimeout(() => {\n if (this.showModal) {\n this.handleComponentOverflow();\n }\n }, 100);\n};\n\n async componentDidLoad() {\n if(!isNestedInIfxComponent(this.hostElement)) { \n const framework = detectFramework();\n trackComponent('ifx-modal', await framework)\n }\n // Query all focusable elements and store them in `focusableElements`.\n // Needed for the \"focus trap\" functionality.\n this.focusableElements = queryShadowRoot(\n this.hostElement.shadowRoot,\n (el) => isHidden(el) || el.matches('[data-focus-trap-edge]'),\n isFocusable\n );\n window.addEventListener('resize', this.handleResize);\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize);\n}\n\n componentWillRender() { \n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n\n async handleComponentOverflow() { \n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\n if (this.showModal && await this.isModalContentContainerHeightReachedViewport()) {\n modalContentContainer.classList.add('no-overflow')\n } else if(modalContentContainer?.classList.contains('no-overflow')) { \n modalContentContainer?.classList.remove('no-overflow')\n }\n }\n\n getFirstFocusableElement(): HTMLElement | null {\n return this.focusableElements[0];\n }\n\n getLastFocusableElement(): HTMLElement | null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n attemptFocus(element: HTMLElement | null) {\n if (element == null) {\n setTimeout(() => { //wait until DOM is fully loaded\n this.closeButton.focus();\n },);\n return;\n }\n\n setTimeout(() => { //wait until DOM is fully loaded\n element.focus();\n }, 0);\n }\n\n open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n // Setting focus on last item and removing immediately\n // so, on tab press first element is focused\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.ifxOpen.emit();\n });\n\n this.hostElement.addEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.ifxOpen.emit();\n }\n }\n\n close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.ifxClose.emit();\n });\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.showModal = false;\n this.ifxClose.emit();\n }\n }\n\n handleKeypress = (event: KeyboardEvent) => {\n if (!this.showModal) {\n return;\n }\n if (event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some((event) => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue) {\n if (newValue === true) {\n this.open();\n } else {\n this.close()\n }\n }\n\n handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP')\n }\n }\n\n handleContentUpdate(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n if(nodes.length > 0) {\n nodes.forEach(node => {\n if (node.observer) {\n node.observer.disconnect();\n delete node.observer;\n }\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n node.observer = observer;\n });\n } \n }\n\n handleButtonsSlotChange(e) {\n if(e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\n this.slotButtonsPresent = true;\n }else{\n this.slotButtonsPresent = false;\n }\n }\n\n isModalContentContainerHeightReachedViewport() {\n //Adding timeout for proper height detection on Edge browser\n return new Promise(resolve => {\n setTimeout(() => {\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\n const modalContentHeight = modalContent.offsetHeight;\n const viewportHeight = window.innerHeight;\n const extraMarginForEdgeBrowser = 3;\n resolve(modalContentHeight + extraMarginForEdgeBrowser >= viewportHeight * 0.9);\n }, 100);\n });\n}\n\n\n render() {\n const isAlertVariant = this.variant !== 'default';\n return (\n <Host>\n <div\n ref={(el) => (this.modalContainer = el)}\n class={`modal-container ${this.showModal ? 'open' : ''}`}\n >\n <div\n class=\"modal-overlay\"\n onClick={() => this.handleOverlayClick()}\n ></div>\n <div\n data-focus-trap-edge\n onFocus={this.handleTopFocus}\n tabindex=\"0\"\n ></div>\n <div\n class={`modal-content-container ${this.size}`}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={this.caption}>\n {isAlertVariant ? (\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\n </div>\n ) : null}\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-caption\">{this.caption}</h2>\n { \n this.showCloseButton && \n <ifx-icon-button class = 'modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON') }>\n </ifx-icon-button>\n }\n </div>\n <div class=\"modal-body\">\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\n </div>\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\n <slot name=\"buttons\" onSlotchange={(e)=>this.handleButtonsSlotChange(e)}>\n </slot>\n </div>\n </div>\n </div>\n <div\n data-focus-trap-edge\n onFocus={this.handleBottomFocus}\n tabindex=\"0\"\n ></div>\n </div>\n </Host>\n\n );\n }\n}"],"version":3}
@@ -135,11 +135,6 @@ const Table = /*@__PURE__*/ proxyCustomElement(class Table extends H {
135
135
  this.variant = 'default';
136
136
  this.showLoading = false;
137
137
  this.originalRowData = [];
138
- this.itemsPerPage = JSON.stringify([
139
- { value: 10, label: '10', selected: true },
140
- { value: 20, label: '20', selected: false },
141
- { value: 30, label: '30', selected: false }
142
- ]);
143
138
  }
144
139
  handleChipChange(event) {
145
140
  const { name, currentSelection, previousSelection } = event.detail;
@@ -477,12 +472,12 @@ const Table = /*@__PURE__*/ proxyCustomElement(class Table extends H {
477
472
  };
478
473
  }
479
474
  const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';
480
- return (h(Host, { key: 'ab4330b9425fdb169007392236918d8b350fc17d' }, h("div", { key: 'e24a70d949fac201bdfa4aa18a524ac9bcf7d197', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '986ffe8eba8003a159835b27b71eab34969e0fc7', class: "sidebar-btn" }, h("ifx-button", { key: '6a171543107c204f70c3c88b86510aadbd8b0277', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '311fb3701889e2ac535266e935d430c19a1a3b23', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: '4e22f2d2d520cfbb857362433bae12f5221c2d6e', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '229bf84bbccd90ff502908b8c0f11e2c13b5a2eb', class: "sidebar-container" }, h("div", { key: '58672767e689b3a4b905ddbfbe4c7af56e3d3ad4', class: "filters-title-container" }, h("span", { key: '5a77ad2d85f51d880d9f541f04b83d001b17dd7a', class: "filters-title" }, "Filters")), h("div", { key: 'bf77cc0cfb917c67dc610190b2b0cea7c8a9de59', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '76b196f4638bccea8958c66de09983ef14dce2a5', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '936e7af7043d32e3aa3fdeb8018ade677d28903b', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '43c0f00b9634ef4449e301fbf0d4c6f3f075381f', name: "topbar-filter" })))), h("div", { key: '44aa129865488ae679716a9dcfce37ed51b3f11f', class: "table-pagination-wrapper" }, h("div", { key: 'e9ea60059fac694381efad7a7bc29dc3fd12df1c', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
475
+ return (h(Host, { key: '6f2bbbf0f6f54b121923a987032ac954a109d836' }, h("div", { key: '3bffc08c1f4a2e8088e37615323a58e4fa2b32a6', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: 'bdbc7badd8eeb7f29c5914badf7804153b792855', class: "sidebar-btn" }, h("ifx-button", { key: '31b78635d92061fdbc71ac433e293ead16c926c6', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '61963cb69d3ced50a1451d6fa1342c80b885e634', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'c20c2395ecd3bd147d27971341b4f6c7f95faf5c', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '90e0cf0773c9c482e348c9e0ad3859aec327f06d', class: "sidebar-container" }, h("div", { key: 'aa990307d66c22681d40165825bfc6f5a0320903', class: "filters-title-container" }, h("span", { key: '84584bfd511e62c13418d4ac985d46aed9b4bb51', class: "filters-title" }, "Filters")), h("div", { key: 'af9f92cb7ec2bd4b85dcc0d0b2829f1632420bc7', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '52e2be083146f57f786bcd563beffabddd6a83e5', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: 'a7979d6fd338ea344027c30109a7a011dc56406d', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '2485a88a51175c2799ab904784d77ffc940b91b5', name: "topbar-filter" })))), h("div", { key: '31d196ac4eaeec4b255a351f62de157325129b6a', class: "table-pagination-wrapper" }, h("div", { key: '0744dd597b97e2aac23b3e8526dae4a39ac8c9f2', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
481
476
  const filter = this.currentFilters[name];
482
477
  const filterValues = filter.filterValues;
483
478
  const isMultiSelect = filter.type !== 'text';
484
479
  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;
485
- })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: 'f24fa444fd4120d2a96c53ba9c16ac6d0ccc1c08', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: 'f4e10a36aac03fe66df8f3fc989b6820ceca03d7', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: 'd49cd5dc37c9cc4de3b5d196150c095521035fcb', class: "matching-results-container" }, h("span", { key: '02dca2f15819680478f3533eaec522ebb77679c1', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '6841b1790a4e3ea0bf33513a3baefaec85740e56', class: "matching-results-text" }, "matching results"))), h("div", { key: '4979f6f00189dcdddcb1f978e822ce9297894375', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '54e2dd3b25e78513aa4d4809d8c5221d7bb0e6a8', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }) : null)))));
480
+ })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '81f1978647c926fb56ce373e5404c710367e1be9', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '574f01906007d6aa46067ec5d48dd372e0fbaab7', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '6f44b6711af0603388b89023013636c0dfbfabbf', class: "matching-results-container" }, h("span", { key: 'ae2104db83897ce4c372e8b5c545e1020614de88', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '7d1718e0694c78e183f291587347e6a895b3b9e8', class: "matching-results-text" }, "matching results"))), h("div", { key: '5323155a4b544e73035e97c3666946a8ca376be5', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '38ca8150996e3fe8e3c9a1766eef189dded2acf1', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage, "items-per-page": '[{"value":"ten","label":"10","selected":true}, {"value":"Twenty","label":"20","selected":false}, {"value":"Thirty","label":"30","selected":false}]' }) : null)))));
486
481
  }
487
482
  hasButtonCol() {
488
483
  return this.getColData().some(column => column.field === 'button');