@infineon/infineon-design-system-stencil 33.2.1--canary.1723.b0e0253c13cf7166d5e9a69d5006845c2776873e.0 → 33.2.1--canary.1847.aa1c8b6d72cee964aa4a26dfd807f16b2dadc7df.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.
- package/dist/cjs/ifx-alert_2.cjs.entry.js +1 -1
- package/dist/cjs/ifx-basic-table.cjs.entry.js +1 -1
- package/dist/cjs/ifx-chip_3.cjs.entry.js +91 -120
- package/dist/cjs/ifx-chip_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-faq.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-accordion.cjs.entry.js +2 -2
- package/dist/cjs/ifx-filter-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-search.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-type-group.cjs.entry.js +1 -1
- package/dist/cjs/ifx-list-entry.cjs.entry.js +1 -1
- package/dist/cjs/ifx-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-radio-button-group.cjs.entry.js +1 -1
- package/dist/cjs/ifx-radio-button.cjs.entry.js +2 -2
- package/dist/cjs/ifx-search-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-search-field.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segment.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segmented-control.cjs.entry.js +2 -2
- package/dist/cjs/ifx-select.cjs.entry.js +2 -2
- package/dist/cjs/ifx-slider.cjs.entry.js +2 -2
- package/dist/cjs/ifx-spinner_2.cjs.entry.js +6 -6
- package/dist/cjs/ifx-status.cjs.entry.js +1 -1
- package/dist/cjs/ifx-step.cjs.entry.js +4 -4
- package/dist/cjs/ifx-stepper.cjs.entry.js +2 -2
- package/dist/cjs/ifx-switch.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tab.cjs.entry.js +1 -1
- package/dist/cjs/ifx-table.cjs.entry.js +2 -2
- package/dist/cjs/ifx-tabs.cjs.entry.js +2 -2
- package/dist/cjs/ifx-tag.cjs.entry.js +1 -1
- package/dist/cjs/ifx-templates-ui.cjs.entry.js +1 -1
- package/dist/cjs/ifx-textarea.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tooltip.cjs.entry.js +4 -4
- package/dist/cjs/infineon-design-system-stencil.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/pagination/pagination.js +94 -122
- package/dist/collection/components/pagination/pagination.js.map +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/radio-button/radio-button.js +2 -2
- package/dist/collection/components/radio-button-group/radio-button-group.js +1 -1
- package/dist/collection/components/search-bar/search-bar.js +1 -1
- package/dist/collection/components/search-field/search-field.js +1 -1
- package/dist/collection/components/segmented-control/segment/segment.js +1 -1
- package/dist/collection/components/segmented-control/segmented-control.js +2 -2
- package/dist/collection/components/select/single-select/select.js +2 -2
- package/dist/collection/components/slider/slider.js +2 -2
- package/dist/collection/components/spinner/spinner.js +2 -2
- package/dist/collection/components/status/status.js +1 -1
- package/dist/collection/components/stepper/step/step.js +4 -4
- package/dist/collection/components/stepper/stepper.js +2 -2
- package/dist/collection/components/switch/switch.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-bar/filter-bar.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js +2 -2
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js +1 -1
- package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js +1 -1
- package/dist/collection/components/table-advanced-version/table.js +2 -2
- package/dist/collection/components/table-basic-version/table.js +1 -1
- package/dist/collection/components/tabs/tab.js +1 -1
- package/dist/collection/components/tabs/tabs.js +2 -2
- package/dist/collection/components/tag/tag.js +1 -1
- package/dist/collection/components/templates/template/template.js +1 -1
- package/dist/collection/components/templates/templates-ui/templates-ui.js +1 -1
- package/dist/collection/components/text-field/text-field.js +4 -4
- package/dist/collection/components/textarea/textarea.js +1 -1
- package/dist/collection/components/tooltip/tooltip.js +4 -4
- package/dist/collection/stories/setup-and-installation/faq/faq.js +1 -1
- package/dist/components/ifx-basic-table.js +1 -1
- package/dist/components/ifx-faq.js +1 -1
- package/dist/components/ifx-filter-accordion.js +2 -2
- package/dist/components/ifx-filter-bar.js +1 -1
- package/dist/components/ifx-filter-search.js +2 -2
- package/dist/components/ifx-filter-type-group.js +1 -1
- package/dist/components/ifx-list-entry.js +2 -2
- package/dist/components/ifx-pagination.js +1 -1
- package/dist/components/ifx-progress-bar.js +1 -1
- package/dist/components/ifx-radio-button-group.js +1 -1
- package/dist/components/ifx-radio-button.js +1 -1
- package/dist/components/ifx-search-bar.js +2 -2
- package/dist/components/ifx-search-field.js +1 -1
- package/dist/components/ifx-segment.js +1 -1
- package/dist/components/ifx-segmented-control.js +2 -2
- package/dist/components/ifx-select.js +1 -1
- package/dist/components/ifx-set-filter.js +2 -2
- package/dist/components/ifx-slider.js +2 -2
- package/dist/components/ifx-spinner.js +1 -1
- package/dist/components/ifx-status.js +1 -1
- package/dist/components/ifx-step.js +4 -4
- package/dist/components/ifx-stepper.js +2 -2
- package/dist/components/ifx-switch.js +1 -1
- package/dist/components/ifx-tab.js +1 -1
- package/dist/components/ifx-table.js +4 -4
- package/dist/components/ifx-tabs.js +2 -2
- package/dist/components/ifx-tag.js +1 -1
- package/dist/components/ifx-template.js +1 -1
- package/dist/components/ifx-templates-ui.js +4 -4
- package/dist/components/ifx-text-field.js +1 -1
- package/dist/components/ifx-textarea.js +1 -1
- package/dist/components/ifx-tooltip.js +4 -4
- package/dist/components/{p-1d737cf7.js → p-1266857d.js} +3 -3
- package/dist/components/{p-1d737cf7.js.map → p-1266857d.js.map} +1 -1
- package/dist/components/{p-0ccba8b1.js → p-42385607.js} +95 -123
- package/dist/components/p-42385607.js.map +1 -0
- package/dist/components/{p-26e62031.js → p-77e746ee.js} +3 -3
- package/dist/components/{p-26e62031.js.map → p-77e746ee.js.map} +1 -1
- package/dist/components/{p-519cb249.js → p-85ce5a1e.js} +3 -3
- package/dist/components/{p-519cb249.js.map → p-85ce5a1e.js.map} +1 -1
- package/dist/components/{p-7b38ddd5.js → p-dccd1c1c.js} +2 -2
- package/dist/components/{p-7b38ddd5.js.map → p-dccd1c1c.js.map} +1 -1
- package/dist/components/{p-59110a4e.js → p-eedb3b58.js} +5 -5
- package/dist/components/{p-59110a4e.js.map → p-eedb3b58.js.map} +1 -1
- package/dist/components/{p-79352b7c.js → p-f824645f.js} +4 -4
- package/dist/components/{p-79352b7c.js.map → p-f824645f.js.map} +1 -1
- package/dist/esm/ifx-alert_2.entry.js +1 -1
- package/dist/esm/ifx-basic-table.entry.js +1 -1
- package/dist/esm/ifx-chip_3.entry.js +91 -120
- package/dist/esm/ifx-chip_3.entry.js.map +1 -1
- package/dist/esm/ifx-faq.entry.js +1 -1
- package/dist/esm/ifx-filter-accordion.entry.js +2 -2
- package/dist/esm/ifx-filter-bar.entry.js +1 -1
- package/dist/esm/ifx-filter-search.entry.js +1 -1
- package/dist/esm/ifx-filter-type-group.entry.js +1 -1
- package/dist/esm/ifx-list-entry.entry.js +1 -1
- package/dist/esm/ifx-progress-bar.entry.js +1 -1
- package/dist/esm/ifx-radio-button-group.entry.js +1 -1
- package/dist/esm/ifx-radio-button.entry.js +2 -2
- package/dist/esm/ifx-search-bar.entry.js +1 -1
- package/dist/esm/ifx-search-field.entry.js +1 -1
- package/dist/esm/ifx-segment.entry.js +1 -1
- package/dist/esm/ifx-segmented-control.entry.js +2 -2
- package/dist/esm/ifx-select.entry.js +2 -2
- package/dist/esm/ifx-slider.entry.js +2 -2
- package/dist/esm/ifx-spinner_2.entry.js +6 -6
- package/dist/esm/ifx-status.entry.js +1 -1
- package/dist/esm/ifx-step.entry.js +4 -4
- package/dist/esm/ifx-stepper.entry.js +2 -2
- package/dist/esm/ifx-switch.entry.js +1 -1
- package/dist/esm/ifx-tab.entry.js +1 -1
- package/dist/esm/ifx-table.entry.js +2 -2
- package/dist/esm/ifx-tabs.entry.js +2 -2
- package/dist/esm/ifx-tag.entry.js +1 -1
- package/dist/esm/ifx-templates-ui.entry.js +1 -1
- package/dist/esm/ifx-textarea.entry.js +1 -1
- package/dist/esm/ifx-tooltip.entry.js +4 -4
- package/dist/esm/infineon-design-system-stencil.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js.map +1 -1
- package/dist/infineon-design-system-stencil/{p-69799784.entry.js → p-00b3d9bf.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-11fa8bcb.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-dba0c2d2.entry.js → p-3e6ddbf5.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-9feda3ff.entry.js → p-42964318.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-56f6da95.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-7de29aa8.entry.js → p-5ce016ad.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-6012a317.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-5d486e15.entry.js → p-64930d03.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-602a1ada.entry.js → p-66d04b9e.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-fe55dfcd.entry.js → p-6d936400.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-1abbcdbc.entry.js → p-7564f328.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-d9f7f285.entry.js → p-760b9305.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-6c3c5b20.entry.js → p-7d761140.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-1f745731.entry.js → p-8215490a.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-74fd43e9.entry.js → p-9414543f.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-a1bb909f.entry.js → p-a045ee93.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-afe7fdf8.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-05d332bd.entry.js → p-b77e56fd.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-485ba923.entry.js → p-cab23e90.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-cf3122b2.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-5f6da116.entry.js → p-d1a97fd5.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-8531337f.entry.js → p-d9b49071.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-b7057914.entry.js → p-e4319c48.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-76e2c9c5.entry.js → p-e62df6c3.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-b6d2073e.entry.js → p-ec7a9e00.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-b1c2e67a.entry.js → p-f12c2743.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-332313b0.entry.js → p-f2932f07.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-1d47cfa5.entry.js → p-f7f759d9.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-f7f759d9.entry.js.map +1 -0
- package/dist/infineon-design-system-stencil/{p-427b82a8.entry.js → p-fb3737ae.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-63679298.entry.js → p-fbdd611c.entry.js} +2 -2
- package/dist/types/components/pagination/pagination.d.ts +10 -11
- package/package.json +1 -1
- package/dist/components/p-0ccba8b1.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-1d47cfa5.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-37e75e7c.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-50793991.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-65d9faca.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-8dbe0add.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-e2d0ad64.entry.js +0 -2
- /package/dist/infineon-design-system-stencil/{p-69799784.entry.js.map → p-00b3d9bf.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-8dbe0add.entry.js.map → p-11fa8bcb.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-dba0c2d2.entry.js.map → p-3e6ddbf5.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-9feda3ff.entry.js.map → p-42964318.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-65d9faca.entry.js.map → p-56f6da95.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-7de29aa8.entry.js.map → p-5ce016ad.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-e2d0ad64.entry.js.map → p-6012a317.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-5d486e15.entry.js.map → p-64930d03.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-602a1ada.entry.js.map → p-66d04b9e.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-fe55dfcd.entry.js.map → p-6d936400.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-1abbcdbc.entry.js.map → p-7564f328.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-d9f7f285.entry.js.map → p-760b9305.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-6c3c5b20.entry.js.map → p-7d761140.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-1f745731.entry.js.map → p-8215490a.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-74fd43e9.entry.js.map → p-9414543f.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-a1bb909f.entry.js.map → p-a045ee93.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-37e75e7c.entry.js.map → p-afe7fdf8.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-05d332bd.entry.js.map → p-b77e56fd.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-485ba923.entry.js.map → p-cab23e90.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-50793991.entry.js.map → p-cf3122b2.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-5f6da116.entry.js.map → p-d1a97fd5.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-8531337f.entry.js.map → p-d9b49071.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-b7057914.entry.js.map → p-e4319c48.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-76e2c9c5.entry.js.map → p-e62df6c3.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-b6d2073e.entry.js.map → p-ec7a9e00.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-b1c2e67a.entry.js.map → p-f12c2743.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-332313b0.entry.js.map → p-f2932f07.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-427b82a8.entry.js.map → p-fb3737ae.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-63679298.entry.js.map → p-fbdd611c.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../../src/components/pagination/pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-pagination',\n styleUrl: 'pagination.scss',\n shadow: true\n})\nexport class Pagination {\n @Element() el;\n @Event() ifxPageChange: EventEmitter;\n @Prop() currentPage: number = 0;\n @State() internalPage: number = 1;\n @State() internalItemsPerPage: number = 10;\n @State() numberOfPages: number[] = [];\n @Prop() total: number = 1;\n @Prop() itemsPerPage: any[] | string;\n @State() filteredItemsPerPage: any[]\n\n private CLASS_DISABLED = \"disabled\"\n private CLASS_ACTIVE = \"active\"\n private CLASS_SIBLING_ACTIVE = \"active-sibling\"\n private DATA_KEY = \"pagination\";\n\n @Listen('ifxSelect')\n setItemsPerPage(e) {\n if(e.detail) {\n this.internalItemsPerPage = parseInt(e.detail.label)\n } else { \n this.internalItemsPerPage = 10;\n }\n }\n\n componentDidLoad() {\n this.calculateVisiblePageIndices()\n var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n let leftArrow = paginationElement.querySelector('.prev')\n this.navigateSinglePage(leftArrow, true)\n\n }\n\n calculateNumberOfPages() {\n if (isNaN(this.currentPage)) {\n this.currentPage = 1;\n }\n const total = this.total <= this.internalItemsPerPage ? this.internalItemsPerPage : this.total;\n const itemsPerPage = this.internalItemsPerPage;\n const totalPageNumber = Math.ceil(total / itemsPerPage);\n\n if (this.currentPage <= 0) {\n this.internalPage = 1;\n } else if (this.currentPage > totalPageNumber) {\n this.internalPage = totalPageNumber;\n } else this.internalPage = this.currentPage;\n\n this.numberOfPages = Array.from({ length: totalPageNumber }, (_, index) => index + 1);\n }\n\n filterOptionsArray() { \n let obj: any[] = Array.isArray(this.itemsPerPage) ? this.itemsPerPage : JSON.parse(this.itemsPerPage);\n for(let i = 0; i < obj.length; i++) { \n let item = obj[i];\n if(!item.label) { \n item.label = item.value;\n }\n }\n this.filteredItemsPerPage = obj;\n }\n\n componentWillLoad() {\n this.calculateNumberOfPages()\n this.filterOptionsArray()\n }\n\n componentDidUpdate() {\n var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n var listItems = paginationElement.querySelectorAll(\"li\");\n this.addEventListenersToPageItems(listItems, paginationElement)\n\n if (paginationElement.dataset[this.DATA_KEY] < this.numberOfPages) {\n paginationElement.dataset[this.DATA_KEY] = paginationElement.dataset[this.DATA_KEY];\n } else paginationElement.dataset[this.DATA_KEY] = 0;\n\n this.changePage(paginationElement, false)\n }\n\n componentWillUpdate() {\n this.calculateNumberOfPages()\n }\n\n handleEventEmission(currActive) {\n let currentPage = currActive + 1;\n let totalPages = this.numberOfPages.length;\n let prevPage = currActive === 0 ? null : currActive;\n let nextPage = currActive + 2 > totalPages ? null : currActive + 2;\n let itemsPerPage = this.internalItemsPerPage\n this.ifxPageChange.emit({ currentPage, totalPages, prevPage, nextPage, itemsPerPage })\n }\n\n addEventListenersToPageItems(listItems, paginationContainer) {\n listItems.forEach((item) => {\n item.addEventListener(\"click\", (e) => {\n var parent = paginationContainer;\n let listItems = parent.querySelectorAll(\"li\");\n parent.dataset[this.DATA_KEY] = Array.from(listItems).indexOf(e.currentTarget)\n this.changePage(parent, false)\n });\n });\n }\n\n initPagination(paginationContainer) {\n var listItems = paginationContainer.querySelectorAll(\"li\");\n\n paginationContainer.dataset[this.DATA_KEY] = Array.from(listItems).indexOf(paginationContainer.querySelector(\".active\"));\n\n paginationContainer.querySelector(\".prev\").addEventListener(\"click\", (e) => this.navigateSinglePage(e, false));\n paginationContainer.querySelector(\".next\").addEventListener(\"click\", (e) => this.navigateSinglePage(e, false));\n\n this.addEventListenersToPageItems(listItems, paginationContainer)\n }\n\n navigateSinglePage(e, initialValue) {\n let el = e;\n if (typeof e.target === 'object') {\n el = e.target\n }\n\n if (!el.classList.contains(this.CLASS_DISABLED)) {\n var parent = el.closest(\".pagination\");\n var currActive = parseInt(parent.dataset[this.DATA_KEY], 10);\n currActive += 1 * (el.classList.contains(\"prev\") ? -1 : 1);\n\n if (currActive === -1) {\n currActive = 0;\n }\n\n parent.dataset[this.DATA_KEY] = currActive;\n this.changePage(parent, initialValue)\n }\n }\n\n changePage(pagination, initialValue) {\n const paginationContainer = pagination;\n var listItems = paginationContainer.querySelectorAll(\"li\");\n var currActive = parseInt(paginationContainer.dataset[this.DATA_KEY], 10);\n\n listItems.forEach((item) => {\n item.classList.remove(this.CLASS_ACTIVE);\n item.classList.remove(this.CLASS_SIBLING_ACTIVE);\n });\n\n if (initialValue && this.internalPage > 1) {\n currActive = Math.floor(this.internalPage - 1);\n paginationContainer.dataset[this.DATA_KEY] = currActive;\n }\n\n if(!initialValue) { \n this.handleEventEmission(currActive)\n }\n\n\n listItems[currActive].classList.add(this.CLASS_ACTIVE);\n\n if (currActive === 0) {\n paginationContainer.querySelector(\".prev\").classList.add(this.CLASS_DISABLED);\n paginationContainer.querySelector(\".prev\").disabled = true;\n\n } else {\n listItems[currActive - 1].classList.add(this.CLASS_SIBLING_ACTIVE);\n paginationContainer.querySelector(\".prev\").classList.remove(this.CLASS_DISABLED);\n paginationContainer.querySelector(\".prev\").disabled = false;\n }\n\n if (currActive === (listItems.length - 1)) {\n paginationContainer.querySelector(\".next\").classList.add(this.CLASS_DISABLED);\n paginationContainer.querySelector(\".next\").disabled = true;\n\n } else {\n paginationContainer.querySelector(\".next\").classList.remove(this.CLASS_DISABLED);\n paginationContainer.querySelector(\".next\").disabled = false;\n }\n }\n\n calculateVisiblePageIndices() {\n var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n this.initPagination(paginationElement)\n }\n\n render() {\n return (\n <div aria-label='a pagination' aria-value={this.currentPage} class=\"container\">\n <div class='items__per-page-wrapper'>\n <div class='items__per-page-label'>Results per Page</div>\n <div class='items__per-page-field'>\n <ifx-select\n value='undefined'\n size='s'\n placeholder='false'\n show-search='false'\n search-placeholder-value='Search...'\n disabled={false}\n error={false}\n error-message='Error'\n label=''\n placeholder-value='Placeholder'\n options={this.filteredItemsPerPage} >\n </ifx-select>\n </div>\n </div>\n <div class='items__total-wrapper'>\n <div class='page__numbers-wrapper'>\n <div class=\"pagination\">\n <ifx-icon-button variant='secondary' class=\"prev\" color='primary' icon='arrow-left-24'></ifx-icon-button>\n <ol>\n {this.numberOfPages.map((item) =>\n <li class={`${this.internalPage === item ? 'active' : \"\"}`}><a href={undefined}>{item}</a></li>)}\n </ol>\n <ifx-icon-button class=\"next\" variant='secondary' color='primary' icon='arrow-right-24'></ifx-icon-button>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}"]}
|
|
1
|
+
{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../../src/components/pagination/pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'ifx-pagination',\n styleUrl: 'pagination.scss',\n shadow: true\n})\nexport class Pagination {\n @Element() el: HTMLElement;\n @Event() ifxPageChange: EventEmitter;\n @Prop() currentPage: number = 1;\n @State() internalPage: number = 1;\n @State() internalItemsPerPage: number = 10;\n @State() numberOfPages: number[] = [];\n @Prop() total: number = 1;\n @Prop() itemsPerPage: any[] | string;\n @State() filteredItemsPerPage: any[] = [];\n @State() visiblePages: (number | string)[] = [];\n\n private CLASS_DISABLED = \"disabled\";\n private CLASS_ACTIVE = \"active\";\n private prevInternalPage: number;\n\n @Listen('ifxSelect')\n setItemsPerPage(e: CustomEvent) {\n const selectedValue = e.detail?.value || e.detail?.label; \n const newItemsPerPage = parseInt(selectedValue) || 10;\n\n if (newItemsPerPage === this.internalItemsPerPage) {\n return;\n }\n\n this.internalItemsPerPage = newItemsPerPage;\n this.internalPage = 1; \n this.calculateNumberOfPages();\n this.updateVisiblePages();\n this.handleEventEmission();\n }\n\n componentDidLoad() {\n this.initPagination();\n }\n\n updateVisiblePages() {\n const buffer = 2;\n const totalPages = this.numberOfPages.length;\n const current = this.internalPage;\n let pages: (number | string)[] = [];\n \n if (totalPages <= 5) {\n pages = [...this.numberOfPages];\n } else {\n pages.push(1);\n \n if (current > buffer + 1) pages.push('...');\n \n let start = Math.max(2, current - buffer);\n let end = Math.min(totalPages - 1, current + buffer);\n \n if (current <= buffer + 1) end = buffer * 2 + 1;\n if (current >= totalPages - buffer) start = totalPages - buffer * 2;\n \n for (let i = start; i <= end; i++) pages.push(i);\n \n if (current < totalPages - buffer) pages.push('...');\n pages.push(totalPages);\n }\n \n this.visiblePages = [...new Set(pages)];\n }\n\n calculateNumberOfPages() {\n const totalPages = Math.ceil(this.total / this.internalItemsPerPage);\n this.numberOfPages = Array.from({ length: totalPages }, (_, i) => i + 1);\n this.internalPage = Math.max(1, Math.min(this.currentPage, totalPages));\n }\n\n filterOptionsArray() { \n const items = typeof this.itemsPerPage === 'string' ? \n JSON.parse(this.itemsPerPage) : this.itemsPerPage;\n this.filteredItemsPerPage = items.map(item => ({\n ...item,\n label: item.label || item.value\n }));\n }\n\n componentWillLoad() {\n this.calculateNumberOfPages();\n this.filterOptionsArray();\n this.updateVisiblePages();\n }\n\n componentWillUpdate() { \n if (this.prevInternalPage !== this.internalPage) {\n this.updateVisiblePages();\n this.prevInternalPage = this.internalPage;\n }\n }\n\n componentDidUpdate() {\n this.initPagination();\n }\n\n handleEventEmission() {\n this.ifxPageChange.emit({\n currentPage: this.internalPage,\n totalPages: this.numberOfPages.length,\n itemsPerPage: this.internalItemsPerPage\n });\n }\n\n initPagination() {\n const pagination = this.el.shadowRoot.querySelector('.pagination');\n if (!pagination) return;\n\n const updateButtons = () => {\n const prev = pagination.querySelector<HTMLButtonElement>('.prev');\n const next = pagination.querySelector<HTMLButtonElement>('.next');\n if (prev) {\n prev.disabled = this.internalPage === 1;\n prev.classList.toggle(this.CLASS_DISABLED, this.internalPage === 1);\n }\n if (next) {\n next.disabled = this.internalPage === this.numberOfPages.length;\n next.classList.toggle(this.CLASS_DISABLED, this.internalPage === this.numberOfPages.length);\n }\n };\n\n pagination.querySelectorAll('li').forEach(li => {\n li.removeEventListener('click', this.handlePageClick);\n li.addEventListener('click', this.handlePageClick);\n });\n\n updateButtons();\n }\n\n private handlePageClick = (e: Event) => {\n const li = e.currentTarget as HTMLLIElement;\n const page = parseInt(li.dataset.page);\n if (!isNaN(page)) this.changePage(page);\n };\n\n changePage(newPage: number) {\n newPage = Math.max(1, Math.min(newPage, this.numberOfPages.length));\n if (newPage === this.internalPage) return;\n \n this.internalPage = newPage;\n this.handleEventEmission();\n this.initPagination();\n }\n\n render() {\n return (\n <div class=\"container\">\n <div class=\"items__per-page-wrapper\">\n <div class=\"items__per-page-label\">Results per Page</div>\n <div class=\"items__per-page-field\">\n <ifx-select\n value={undefined}\n size=\"s\"\n options={this.filteredItemsPerPage}\n placeholder-value=\"Select\"\n ></ifx-select>\n </div>\n </div>\n \n <div class=\"items__total-wrapper\">\n <div class=\"pagination\">\n <ifx-icon-button\n class=\"prev\"\n icon=\"arrow-left-24\"\n onClick={() => this.changePage(this.internalPage - 1)}\n ></ifx-icon-button>\n \n <ol>\n {this.visiblePages.map((page, i) => typeof page === 'number' ? (\n <li \n key={`page-${page}`}\n class={{ [this.CLASS_ACTIVE]: page === this.internalPage }}\n data-page={page}\n >\n <a href=\"javascript:void(0)\">{page}</a>\n </li>\n ) : (\n <li class=\"ellipsis\" key={`ellipsis-${i}`}>\n <span>...</span>\n </li>\n ))}\n </ol>\n \n <ifx-icon-button\n class=\"next\"\n icon=\"arrow-right-24\"\n onClick={() => this.changePage(this.internalPage + 1)}\n ></ifx-icon-button>\n </div>\n </div>\n </div>\n );\n }\n}"]}
|
|
@@ -13,7 +13,7 @@ export class ProgressBar {
|
|
|
13
13
|
this.internalValue = this.value;
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (h("div", { key: '
|
|
16
|
+
return (h("div", { key: '0a056197a5a987fabf6fe5ded84b00645e763570', "aria-label": 'a progress bar', "aria-value": this.value, class: `progress-bar ${this.size}` }, h("div", { key: 'b652cb9f595beba037f08bf623be2a4421d4db3d', class: "progress", style: { width: `${this.internalValue}%` } }, this.showLabel && this.size !== "s" && this.internalValue !== 0 && h("span", { key: '7c7ec56c39119ad47a9ce6dcf20f87790f1b342c', class: "label" }, `${this.internalValue}%`))));
|
|
17
17
|
}
|
|
18
18
|
static get is() { return "ifx-progress-bar"; }
|
|
19
19
|
static get encapsulation() { return "shadow"; }
|
|
@@ -87,10 +87,10 @@ export class RadioButton {
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
|
-
return (h("div", { key: '
|
|
90
|
+
return (h("div", { key: '0517c170a72f27da3bce7aa8dcedc792d6cc4bb1', role: "radio", "aria-checked": String(this.internalChecked), "aria-disabled": String(this.disabled), class: `radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`, onClick: (e) => this.handleRadioButtonClick(e), tabindex: this.disabled ? -1 : 0 }, h("div", { key: '57c9b9ac3d09c63868976fd9c2eef12d68fbf0f1', class: `radioButton__wrapper
|
|
91
91
|
${this.internalChecked ? 'checked' : ''}
|
|
92
92
|
${this.disabled ? 'disabled' : ''}
|
|
93
|
-
${this.error ? 'error' : ''}` }, this.internalChecked && h("div", { key: '
|
|
93
|
+
${this.error ? 'error' : ''}` }, this.internalChecked && h("div", { key: '298eb53745b74e9477fd4d7109af6059d7a9adb1', class: "radioButton__wrapper-mark" })), this.hasSlot && (h("div", { key: 'a635e823d337682073a00b2160adf94b7d3362ac', class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '1a302c9962dffa61bbce7a26ea7be1067c844b4f' }))), h("input", { key: '0d0e61739b0d63ce2ce07c29db9b7801c0afb2b6', type: "radio", hidden: true, ref: el => this.inputElement = el, name: this.name, value: this.value, checked: this.internalChecked, disabled: this.disabled, onClick: (e) => e.stopPropagation() })));
|
|
94
94
|
}
|
|
95
95
|
static get is() { return "ifx-radio-button"; }
|
|
96
96
|
static get encapsulation() { return "shadow"; }
|
|
@@ -40,7 +40,7 @@ export class RadioButtonGroup {
|
|
|
40
40
|
this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);
|
|
41
41
|
}
|
|
42
42
|
render() {
|
|
43
|
-
return (h("div", { key: '
|
|
43
|
+
return (h("div", { key: 'db47c6f68f4fc71019cdb241b2cec97868253a9a', class: 'radio-button-group-container' }, this.showGroupLabel ? h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', h("div", { key: 'faabddc94a68916f090cee61eaaee086f141a334', class: `radio-button-group ${this.alignment} ${this.size}` }, h("slot", { key: '5139a0aec69f151e302ae57564bebcee202ef08d', onSlotchange: this.handleSlotChange })), this.showCaption ? (h("div", { class: `caption ${this.hasErrors ? 'error' : 'default'}` }, this.showCaptionIcon ? h("div", { class: 'caption-icon' }, h("ifx-icon", { icon: "c-info-16" })) : '', h("div", { class: 'caption-text' }, this.captionText))) : ''));
|
|
44
44
|
}
|
|
45
45
|
static get is() { return "ifx-radio-button-group"; }
|
|
46
46
|
static get encapsulation() { return "shadow"; }
|
|
@@ -30,7 +30,7 @@ export class SearchBar {
|
|
|
30
30
|
this.value = event.detail;
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
|
-
return (h("div", { key: '
|
|
33
|
+
return (h("div", { key: '9995b9399f48a87b668b43aa4dbec29a752aaf9f', "aria-label": 'a search bar', "aria-disabled": this.disabled, class: `search-bar ${this.internalState ? 'open' : 'closed'}` }, this.internalState ? (h("div", { class: "search-bar-wrapper" }, h("ifx-search-field", { autocomplete: this.autocomplete, disabled: this.disabled, value: this.value, maxlength: this.maxlength, onIfxInput: this.handleInput.bind(this) }, h("ifx-icon", { icon: "search-16", slot: "search-icon" })), h("a", { tabindex: "-1", href: 'javascript:void(0)', onClick: this.handleCloseButton }, "Close"))) : (h("div", { class: "search-bar__icon-wrapper", onClick: this.handleCloseButton }, h("ifx-icon", { icon: "search-16" })))));
|
|
34
34
|
}
|
|
35
35
|
static get is() { return "ifx-search-bar"; }
|
|
36
36
|
static get encapsulation() { return "shadow"; }
|
|
@@ -46,7 +46,7 @@ export class SearchField {
|
|
|
46
46
|
this.showDeleteIconInternalState = false;
|
|
47
47
|
}
|
|
48
48
|
render() {
|
|
49
|
-
return (h("div", { key: '
|
|
49
|
+
return (h("div", { key: 'e4c4bb53ff7d3f464de62991fd54c52d50eb5bd6', "aria-label": "a search field for user input", "aria-disabled": this.disabled, "aria-value": this.value, class: 'search-field' }, h("div", { key: '48db3ec88d4f79505a5ed413e3b7d3030f3950f6', class: this.getWrapperClassNames(), tabindex: 1, onFocus: () => this.focusInput(), onClick: () => this.focusInput() }, h("ifx-icon", { key: '6aecdb48902395fc8cd80cd24cacefa3014bc470', icon: "search-16", class: "search-icon" }), h("input", { key: '5e6620ec20ad3f2ae223067ff9ea4fac935eda90', ref: (el) => (this.inputElement = el), type: "text", autocomplete: this.autocomplete, onInput: () => this.handleInput(), placeholder: this.placeholder, disabled: this.disabled, maxlength: this.maxlength, value: this.value }), this.showDeleteIcon && this.showDeleteIconInternalState ? (h("ifx-icon", { icon: "cremove16", class: "delete-icon", onClick: this.handleDelete })) : null)));
|
|
50
50
|
}
|
|
51
51
|
getSizeClass() {
|
|
52
52
|
return `${this.size}` === "s"
|
|
@@ -18,7 +18,7 @@ export class Segment {
|
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
20
|
render() {
|
|
21
|
-
return (h("div", { key: '
|
|
21
|
+
return (h("div", { key: '242103eeefd5c176ebb090767290c3b209c896f7', class: `segment ${this.selected ? 'segment--selected' : ''}`, tabIndex: 0, onClick: () => { this.handleSegmentClick(); }, onKeyDown: (e) => { this.handleSegmentKeyDown(e); } }, h("ifx-icon", { key: '7a7a84efd91e773e132d137e96107465ad5cbe8b', icon: this.icon }), " ", h("slot", { key: 'a3aff1230d6b0f3edf4c90b6748f4c515c3c04a0' })));
|
|
22
22
|
}
|
|
23
23
|
static get is() { return "ifx-segment"; }
|
|
24
24
|
static get encapsulation() { return "shadow"; }
|
|
@@ -62,8 +62,8 @@ export class SegmentedControl {
|
|
|
62
62
|
this.setActiveSegment();
|
|
63
63
|
}
|
|
64
64
|
render() {
|
|
65
|
-
return (h("div", { key: '
|
|
66
|
-
h("div", { key: '
|
|
65
|
+
return (h("div", { key: 'dab5856773fc59c5b96e96b4e63de8bd09b311e8', "aria-value": this.selectedValue, "aria-label": 'segmented control', class: 'group' }, h("div", { key: 'ec4d89bbb8838f2bbf37d6ffeb974bb31e4bb977', class: 'group__label' }, this.label.trim()), h("div", { key: 'db10682b8d86a451a922f00e72f1cad6b0e0f2c6', class: 'group__controls' }, h("slot", { key: 'c4a9ef1b511c4b1e495af61d8096e6bf7a153c2b' })), this.caption.trim() &&
|
|
66
|
+
h("div", { key: '8c4158f78ad3c54ae453b7524a82121a06637087', class: 'group__caption' }, h("ifx-icon", { key: '41d0dbfdadf7aaec93ff80be95e91cb496b2aa55', icon: 'cinfo16' }), " ", this.caption.trim())));
|
|
67
67
|
}
|
|
68
68
|
componentDidRender() {
|
|
69
69
|
this.setSegmentSize();
|
|
@@ -219,9 +219,9 @@ export class Choices {
|
|
|
219
219
|
// destroy choices element to restore previous dom structure
|
|
220
220
|
// so vdom can replace the element correctly
|
|
221
221
|
this.destroy();
|
|
222
|
-
return (h("div", { key: '
|
|
222
|
+
return (h("div", { key: 'bff7fa929e66d1ec543c3af117e4bfc13346b252', class: `ifx-select-container` }, this.label ? (h("div", { class: "ifx-label-wrapper" }, h("span", null, this.label))) : null, h("div", { key: '1def54c7b443ffffc356d30f3a0aa0bb2608328e', class: `${choicesWrapperClass}
|
|
223
223
|
${this.disabled ? 'disabled' : ''}
|
|
224
|
-
${this.error ? 'error' : ''}`, onClick: this.disabled ? undefined : (e) => this.handleWrapperClick(e), onKeyDown: event => this.handleKeyDown(event) }, h("select", Object.assign({ key: '
|
|
224
|
+
${this.error ? 'error' : ''}`, onClick: this.disabled ? undefined : (e) => this.handleWrapperClick(e), onKeyDown: event => this.handleKeyDown(event) }, h("select", Object.assign({ key: 'c12bc6327ffbb57a1330db8c2434e3bad24bedbd', class: 'single__select-input-field', disabled: this.disabled }, attributes, { "data-trigger": true, onChange: () => this.handleChange() }), this.createSelectOptions(this.options)), h("div", { key: '9141b37e7a576fc7f77c222b8736dfcd8a970bab', class: 'single__select-icon-container' }, this.optionIsSelected && (h("div", { key: '893f8deb63389d6a7049f74d14241af9d0c075b1', class: `ifx-choices__icon-wrapper-delete ${!this.showClearButton ? 'hide' : ''}` }, h("ifx-icon", { key: '3e79e2491df7fad3ae00b98fb902973e6520d650', icon: "cremove16", onClick: () => this.handleDeleteSelection() }))), h("div", { key: 'c64f9e7810ea2b638e131a8271dfca980edbe0c5', class: "ifx-choices__icon-wrapper-up" }, h("ifx-icon", { key: "icon-up", icon: "chevronup-16" })), h("div", { key: '13e02cd81cabd42991124bf091a0ac208cafba29', class: "ifx-choices__icon-wrapper-down" }, h("ifx-icon", { key: "icon-down", icon: "chevron-down-16" })))), this.error ? (h("div", { class: "ifx-error-message-wrapper" }, h("span", null, this.errorMessage))) : null));
|
|
225
225
|
}
|
|
226
226
|
toggleDropdown() {
|
|
227
227
|
const div = this.root.querySelector('.ifx-choices__wrapper');
|
|
@@ -136,10 +136,10 @@ export class IfxSlider {
|
|
|
136
136
|
this.updateValuePercent();
|
|
137
137
|
}
|
|
138
138
|
render() {
|
|
139
|
-
return (h("div", { key: '
|
|
139
|
+
return (h("div", { key: 'a47f129ac76a02e539b02ce53ce3531e4924318b', class: "ifx-slider" }, this.leftText && (h("span", { key: 'f854c9c5553c8a8e62b6448828356a25cbafaa84', class: `left-text` }, this.leftText)), this.leftIcon && (h("ifx-icon", { key: '718b4b1a6978202e56d3380fcb88ba3174644766', icon: this.leftIcon, class: `left-icon${this.disabled ? ' disabled' : ''}` })), (this.type !== 'double') ?
|
|
140
140
|
h("input", { type: "range", min: this.min, max: this.max, step: this.step, value: this.internalValue, disabled: this.disabled, ref: (el) => (this.inputRef = el), onInput: (event) => this.handleInputChange(event), "aria-label": 'a slider', "aria-value": this.value, "aria-disabled": this.disabled })
|
|
141
141
|
:
|
|
142
|
-
h("div", { class: 'range-slider__wrapper', "aria-label": 'a range slider', "aria-value": this.value, "aria-disabled": this.disabled }, h("input", { id: 'min-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMinValue, disabled: this.disabled, ref: (el) => (this.minInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) }), h("input", { id: 'max-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMaxValue, disabled: this.disabled, ref: (el) => (this.maxInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) })), this.rightIcon && (h("ifx-icon", { key: '
|
|
142
|
+
h("div", { class: 'range-slider__wrapper', "aria-label": 'a range slider', "aria-value": this.value, "aria-disabled": this.disabled }, h("input", { id: 'min-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMinValue, disabled: this.disabled, ref: (el) => (this.minInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) }), h("input", { id: 'max-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMaxValue, disabled: this.disabled, ref: (el) => (this.maxInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) })), this.rightIcon && (h("ifx-icon", { key: '821de1c6f6e7e4c34a5bf279c49988521fabd847', icon: this.rightIcon, class: `right-icon${this.disabled ? ' disabled' : ''}` })), this.rightText && (h("span", { key: 'de7cd4fafdccd8bbf82886855f2b446a74139c6f', class: `right-text${this.disabled ? ' disabled' : ''}` }, this.rightText)), this.showPercentage && (this.type !== "double") && (h("span", { key: 'a9a31d31982344e39ed22722d0ec57d24b4968b3', class: `percentage-display${this.disabled ? ' disabled' : ''}` }, this.percentage, "%"))));
|
|
143
143
|
}
|
|
144
144
|
static get is() { return "ifx-slider"; }
|
|
145
145
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,8 +5,8 @@ export class Spinner {
|
|
|
5
5
|
this.inverted = false;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h("div", { key: '
|
|
9
|
-
&& h("div", { key: '
|
|
8
|
+
return (h("div", { key: '8cd82eb8f42bfc92be2a8bf137861378ef5304fe', "aria-label": "spinner indicating a loading process", class: this.getClassNames() }, h("div", { key: 'a8ae208e73eee65cf847b895993ee90d5841cbdd', class: `${this.variant !== 'brand' ? 'border' : ""} ${this.inverted ? 'inverted' : ""}` }), this.variant === 'brand'
|
|
9
|
+
&& h("div", { key: 'de8bcb3ab51f25a6c1081d5857de63aadb342532', class: `semiconductor ${this.inverted ? 'inverted' : ""} ${this.getSizeClass()}` }, h("svg", { key: '7c93484e4e39bc58e4031fb9d8e500393a5f9f40', width: '40', height: '40', viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'f4e0d268ada9e3c8594c906290fff2b4d0680fc2', id: "spinner/conductor" }, h("path", { key: '43f579e8f3b75d8429913c20e1693d2d71aeaa87', id: "Vector", d: "M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z" }))))));
|
|
10
10
|
}
|
|
11
11
|
getSizeClass() {
|
|
12
12
|
return `${this.size}` === "s"
|
|
@@ -8,7 +8,7 @@ export class Status {
|
|
|
8
8
|
var _a;
|
|
9
9
|
const effectiveColor = ((_a = this.color) === null || _a === void 0 ? void 0 : _a.trim()) ? this.color : 'orange-500';
|
|
10
10
|
const containerClass = this.border ? `container border-${effectiveColor}` : 'container no-border';
|
|
11
|
-
return (h("div", { key: '
|
|
11
|
+
return (h("div", { key: '67fb5dcfeb258518a98b4e7fec4d5336efd6ebcd', "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, h("span", { key: 'c7a123e821b5074fe8f215f883aa9d2e59404762', class: `dot ${effectiveColor}` }), h("p", { key: '5798ca747692c831a55f3b2959db6c42d46cc392', class: "text" }, this.label)));
|
|
12
12
|
}
|
|
13
13
|
static get is() { return "ifx-status"; }
|
|
14
14
|
static get encapsulation() { return "shadow"; }
|
|
@@ -42,7 +42,7 @@ export class Step {
|
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
render() {
|
|
45
|
-
return (h("div", { key: '
|
|
45
|
+
return (h("div", { key: '67813ee4b35ccb5ce5b9536760180dc99eb734f2', "aria-current": this.active ? 'step' : false, "aria-disabled": this.active || this.complete ? false : true, onClick: (e) => this.stopOnClickPropogation(e), class: `step-wrapper ${this.stepId === 1 ? 'first-step' : ''}
|
|
46
46
|
${this.error ? 'error' : ''}
|
|
47
47
|
${this.stepperState.variant}
|
|
48
48
|
${this.complete ? 'complete' : ''}
|
|
@@ -50,11 +50,11 @@ export class Step {
|
|
|
50
50
|
indicator-${this.stepperState.indicatorPosition}
|
|
51
51
|
${this.active ? 'active' : ''}
|
|
52
52
|
${this.clickable ? 'clickable' : ''}
|
|
53
|
-
${this.disabled ? 'disabled' : ''}` }, h("div", { key: '
|
|
54
|
-
h("div", { key: '
|
|
53
|
+
${this.disabled ? 'disabled' : ''}` }, h("div", { key: 'b65c11a9334ddc6cfa3760883280cc0929de26db', class: 'step-icon-wrapper' }, this.stepperState.variant !== 'compact' && h("span", { key: '509c2da59919ebc5b730ffc1ef795be3962b4784', class: 'step-connector-l' }), (this.stepperState.variant !== 'compact' && (!this.error || (this.error && this.active))) &&
|
|
54
|
+
h("div", { key: '47b8eb61de8b0d9363d59d386e2ec00824994ffd', class: 'step-icon' }, (this.stepperState.showStepNumber && !this.complete && !this.active) ? this.stepId : '', (this.complete && !this.active) && h("ifx-icon", { key: '528ab6ed4b54e207f56999eda4f204d7237e15ae', icon: 'check16' }), this.active && h("span", { key: '8f3c5e9b1f1faa74c91e343f024bbe86734eb9e5', class: 'active-indic' })), (this.stepperState.variant !== 'compact' && this.error && !this.active) && h("ifx-icon", { key: '40beb5b2ac5c2b80034d935ed499955557757e9a', icon: 'warningf24' }), this.stepperState.variant !== 'compact' && h("span", { key: '02330c59c8340ff48e0c98ca6c5e97d391715a05', class: `step-connector-r ${this.active ? 'active' : ''}` })),
|
|
55
55
|
/* Step labels */
|
|
56
56
|
(this.stepperState.variant !== 'compact' || (this.stepperState.variant === 'compact' && (this.active || this.stepId === this.stepperState.activeStep + 1))) &&
|
|
57
|
-
h("div", { key: '
|
|
57
|
+
h("div", { key: '745dc346d34dee31109bb9f7f466f926b6c3ca21', tabIndex: !this.disabled && this.complete && !this.active ? 0 : -1, class: `step-label ${this.stepperState.variant === 'compact' ? (this.active ? 'curr-label' : 'next-label') : ''}`, onClick: () => { this.handleStepClick(); }, onKeyDown: (e) => { this.handleStepKeyDown(e); } }, (this.stepperState.variant !== 'compact') && h("slot", { key: '488e381198713ca607975f55b3f02b57e9009856' }), this.stepperState.variant === 'compact' && !this.active ? 'Next: ' : '', this.stepperState.variant === 'compact' && h("slot", { key: '09bc9a4e89a11cfbfb0e2f6f46f729588fea66df' }))));
|
|
58
58
|
}
|
|
59
59
|
;
|
|
60
60
|
static get is() { return "ifx-step"; }
|
|
@@ -118,10 +118,10 @@ export class Stepper {
|
|
|
118
118
|
this.syncIfxSteps();
|
|
119
119
|
}
|
|
120
120
|
render() {
|
|
121
|
-
return (h("div", { key: '
|
|
121
|
+
return (h("div", { key: 'ebb0dcfedfa5bbbfb7cd6c5abe7125b948fac551', "aria-label": 'a stepper', role: 'navigation', class: `stepper ${(this.variant !== 'compact' && this.variant !== 'vertical') ? 'default' : this.variant} ${this.variant === 'compact' ? 'compact-' + this.indicatorPosition : ''}` },
|
|
122
122
|
/* Progress bar for compact variant. */
|
|
123
123
|
(this.variant === 'compact') &&
|
|
124
|
-
h("div", { key: '
|
|
124
|
+
h("div", { key: '82ff1eb3fe665ca2cc6690e0ec589e8c3572bf52', class: 'stepper-progress' }, h("div", { key: '31ee2433f257a8da7f8077ea24672fb41fd69298', class: 'progress-detail' }, `${Math.min(this.activeStep, this.stepsCount)} of ${this.stepsCount}`)), h("div", { key: '49ee4b5aaa2fe97dbfcb2855fb2af51a835f7d87', class: `stepper-wrapper` }, h("slot", { key: '3f1ad0132e9d566fc4c54a7fe4f6b294c735325d' }))));
|
|
125
125
|
}
|
|
126
126
|
;
|
|
127
127
|
componentDidRender() {
|
|
@@ -63,7 +63,7 @@ export class Switch {
|
|
|
63
63
|
this.internals.setFormValue(null);
|
|
64
64
|
}
|
|
65
65
|
render() {
|
|
66
|
-
return (h("div", { key: '
|
|
66
|
+
return (h("div", { key: 'e8b7161f772a860e04f0973a03c98759111a02e4', class: "container", role: "switch", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-label": this.name, onClick: () => this.toggleSwitch(), onKeyDown: (event) => this.handleKeyDown(event) }, h("div", { key: '9c5c078eb35d96fe42662eeae2ceb6408126eedf', class: `switch__checkbox-container ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`, tabindex: "0" }, h("div", { key: '93dd1bf0cd4745cca77f97bc655533d9d1fc218a', class: "switch__checkbox-wrapper" }, h("input", { key: '1c51b7b432940b5bd835276ed20d64e26fa907c8', type: "checkbox", hidden: true, name: this.name, disabled: this.disabled, checked: this.internalChecked, value: `${this.value}` }), h("div", { key: '2cfd326305c2e14fab2ef2f795b9dc0864fffaf1', class: `switch ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}` }))), h("div", { key: 'c058972ad6cb6fca2b091304e6419109e2aa83ce', class: `switch__label-wrapper ${this.disabled ? 'disabled' : ''}` }, h("label", { key: 'fc24e0b5b2b2af4fef6cfb4ce6fda28204e3a0a0', htmlFor: "switch" }, h("slot", { key: '9f9fef34b64b9d89647acfa3d1c8d983b8581d0b', onSlotchange: () => this.toggleLabelGap() })))));
|
|
67
67
|
}
|
|
68
68
|
static get is() { return "ifx-switch"; }
|
|
69
69
|
static get encapsulation() { return "shadow"; }
|
|
@@ -88,7 +88,7 @@ export class FilterBar {
|
|
|
88
88
|
// Calculate slotsToShow safely
|
|
89
89
|
const slotsToShow = Math.min(safeVisibleSlots, actualNumberOfComponents, Number.MAX_SAFE_INTEGER);
|
|
90
90
|
const slots = Array.from({ length: slotsToShow }, (_, i) => (h("div", { class: "filter-slot-wrapper" }, h("slot", { name: `filter-component-${i + 1}` }))));
|
|
91
|
-
return (h(Host, { key: '
|
|
91
|
+
return (h(Host, { key: '02aa0e0e21ab38cf8db7b5c5bb07bdaf2977811b' }, h("div", { key: '1576791bdbfbaa6524c55747749d95f8dc1ccca4', class: "search-container" }, h("slot", { key: '83725d28525c6d381517e4478bbfa48c8a4aa9b9', name: "filter-search" }), " "), h("div", { key: '563bd5d6af19d7c28ad682e2737b21672ce18e9d', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: '34b7998a97bba46bec4b8310587952ac06e4c52d', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: '10fb952568f14969d94f2d18471256b03d119a9b', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: '65809bc9432d559547190c951ddebf892990d116', icon: "filter-16" }), "More filters"))))));
|
|
92
92
|
}
|
|
93
93
|
static get is() { return "ifx-filter-bar"; }
|
|
94
94
|
static get encapsulation() { return "shadow"; }
|
|
@@ -31,8 +31,8 @@ export class FilterAccordion {
|
|
|
31
31
|
this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
|
|
32
32
|
}
|
|
33
33
|
render() {
|
|
34
|
-
return (h("div", { key: '
|
|
35
|
-
h("div", { key: '
|
|
34
|
+
return (h("div", { key: '376ed76f31af5f3d28f427909a3b2e2aff418818', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '3b7852c22e5ce179f537600276c84774d16075e6', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '9a9007f413bf9c9d78a05519d7cff15c6d04fb4a', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: 'e3cda79378425d45ac28a407ca1477535a91500c', class: "text" }, h("span", { key: '7bb274dbb2b77fdcc7af82309553a94f2d4bc3be' }, this.filterGroupName), h("ifx-number-indicator", { key: 'f815b35b394b29330c433caac4857f1bbec9c3c0' }, this.count)), h("ifx-icon", { key: '85c66847acbc6e9821a591c8f1918806c3f4ad43', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: '3a0e6b52c4c0acda4ee82bb64212efe85fb8aeef', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
|
|
35
|
+
h("div", { key: 'f9ad9e4fc6e13b44c618769929407a69d1fefae2', class: "filter-accordion-container" }, h("slot", { key: 'df4d00bce31bb9a8aaf2e596fb651603adc6e594', name: "list" }))));
|
|
36
36
|
}
|
|
37
37
|
static get is() { return "ifx-filter-accordion"; }
|
|
38
38
|
static get encapsulation() { return "shadow"; }
|
|
@@ -23,7 +23,7 @@ export class FilterSearch {
|
|
|
23
23
|
this.ifxFilterSearchChange.emit({ filterName: this.filterName, filterValue: this.filterValue, filterKey: this.filterKey }); // Emitting filterKey along with other properties
|
|
24
24
|
}
|
|
25
25
|
render() {
|
|
26
|
-
return (h("div", { key: '
|
|
26
|
+
return (h("div", { key: '3a3909fafa10d861c7ff3b1345220a99c8094fc2', class: `${this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'}` }, h("div", { key: 'f04e9957e504129746969a67d46abf21c5bb468c', class: "filter-name" }, this.filterName), h("ifx-search-field", { key: '4ca35fad09d00bd2d0b7a92111f2abb1182984b3', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
|
|
27
27
|
}
|
|
28
28
|
static get is() { return "ifx-filter-search"; }
|
|
29
29
|
static get encapsulation() { return "shadow"; }
|
package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js
CHANGED
|
@@ -119,7 +119,7 @@ export class IfxFilterTypeGroup {
|
|
|
119
119
|
window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);
|
|
120
120
|
}
|
|
121
121
|
render() {
|
|
122
|
-
return (h(Host, { key: '
|
|
122
|
+
return (h(Host, { key: 'f9e20ecec05c106cc7c46daf6aafdf99b46e2615' }, h("div", { key: '6b7e9c8efa1adb5b363c307395daa4d3dc6008a1', class: "filter-type-group" }, h("slot", { key: '898eaee110d211bd6d11b4004a865e53a75ebfc0', name: "filter-search" }), h("slot", { key: 'a4cd279b6717aea1d774a0500108f756b70644d3', name: "filter-accordion" }))));
|
|
123
123
|
}
|
|
124
124
|
static get is() { return "ifx-filter-type-group"; }
|
|
125
125
|
static get encapsulation() { return "shadow"; }
|
|
@@ -13,7 +13,7 @@ export class ListEntry {
|
|
|
13
13
|
this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (h("div", { key: '
|
|
16
|
+
return (h("div", { key: 'ad65384bebf5cd37c59af70dd26071c371814d9c', class: "wrapper" }, this.type === 'checkbox' ? (h("div", { class: "list-entry" }, h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (h("div", { class: "list-entry" }, h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
|
|
17
17
|
}
|
|
18
18
|
static get is() { return "ifx-list-entry"; }
|
|
19
19
|
static get encapsulation() { return "shadow"; }
|
|
@@ -355,12 +355,12 @@ export class Table {
|
|
|
355
355
|
};
|
|
356
356
|
}
|
|
357
357
|
const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';
|
|
358
|
-
return (h(Host, { key: '
|
|
358
|
+
return (h(Host, { key: '3c30e6dae1c981617cd714f6865516885757ca95' }, h("div", { key: 'fa5de4ffbc20b07dfa9f3f873fd1244e86f408c2', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: 'b2ca3214ab678787c20a5d0da9cba2b25bce013f', class: "sidebar-btn" }, h("ifx-button", { key: 'd0c81bee43c704e9e2550ba7400a7b245068d00c', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '672131c8540ac28ca9ebb479cbdb342c144e523b', icon: "cross-12" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'b5cc8d1d5f8eaf2e3b2f09fa843f3a0321d1e37a', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '139788cef4927835d1b95f43cea84ff1944e4fa8', class: "sidebar-container" }, h("div", { key: '5520d2c3f99fe38dddf6d3b5cc1dfb4635da44dd', class: "filters-title-container" }, h("span", { key: '8f95eee470a39467cbc89e0426fe9bfcf179c5c3', class: "filters-title" }, "Filters")), h("div", { key: 'f8c2aa07dbd579cd8b3407a269eef5fbaf1d9a1e', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '5354d7e546f1e5a8c6f14e71817ef12bcbd18899', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '89c62b2333f9ddea4085d9eb4e76385508cfcfa4', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '488777f09d1452543b17d40c82a4e7e366132c97', name: "topbar-filter" })))), h("div", { key: '73d78f138f52fa0659aeceb68292f0230acd22c6', class: "table-pagination-wrapper" }, h("div", { key: 'bf738458f274eceb313efe93ba27ed1bcb067421', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
|
|
359
359
|
const filter = this.currentFilters[name];
|
|
360
360
|
const filterValues = filter.filterValues;
|
|
361
361
|
const isMultiSelect = filter.type !== 'text';
|
|
362
362
|
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;
|
|
363
|
-
})), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '
|
|
363
|
+
})), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '69cd2533c9124e13ca672f62a0a23fa2d385a462', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '6f50122240ff541835c668400945c8a574129e8b', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '1e96757222d177c88ebd96ac052ffb9e1c045610', class: "matching-results-container" }, h("span", { key: '3e272b3271266654828c28fa874820352cf01aa5', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '5a3d28910e61bb81401026f03951c0dce1cff57e', class: "matching-results-text" }, "matching results"))), h("div", { key: '7f3216bd78123779131e038a62c730411beae8f9', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '4cf52d739457ac1fb9f86a75173fd5a199858e66', 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)))));
|
|
364
364
|
}
|
|
365
365
|
hasButtonCol() {
|
|
366
366
|
return this.getColData().some(column => column.field === 'button');
|
|
@@ -144,7 +144,7 @@ export class Table {
|
|
|
144
144
|
return {};
|
|
145
145
|
}
|
|
146
146
|
render() {
|
|
147
|
-
return (h(Host, { key: '
|
|
147
|
+
return (h(Host, { key: '354a1e781e5323bb669fa4058bb757d99d131f9e' }, h("div", { key: '39ae396feba51be9babfa48c1614e223967ba125', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: 'be413883119cf1862cf171af2944dacf86d8b521', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
|
|
148
148
|
}
|
|
149
149
|
static get is() { return "ifx-basic-table"; }
|
|
150
150
|
static get originalStyleUrls() {
|
|
@@ -8,7 +8,7 @@ export class IfxTab {
|
|
|
8
8
|
this.tabHeaderChange.emit(this.header);
|
|
9
9
|
}
|
|
10
10
|
render() {
|
|
11
|
-
return h("slot", { key: '
|
|
11
|
+
return h("slot", { key: 'b3cfe28ec63f71e875ceedd37084b4a8d73d4068' });
|
|
12
12
|
}
|
|
13
13
|
static get is() { return "ifx-tab"; }
|
|
14
14
|
static get originalStyleUrls() {
|
|
@@ -198,9 +198,9 @@ export class IfxTabs {
|
|
|
198
198
|
}
|
|
199
199
|
render() {
|
|
200
200
|
var _a;
|
|
201
|
-
return (h("div", { key: '
|
|
201
|
+
return (h("div", { key: 'dca1f6498433d621018f11be1b964937219093e5', "aria-label": "navigation tabs", class: `tabs ${this.internalOrientation}` }, h("ul", { key: '459b025979867da69fa83b612d3165fba1bca9cd', role: "tablist", class: "tabs-list" }, (_a = this.tabObjects) === null || _a === void 0 ? void 0 :
|
|
202
202
|
_a.map((tab, index) => (h("li", { class: this.getTabItemClass(index), ref: (el) => (this.tabHeaderRefs[index] = el), onMouseDown: (event) => event.preventDefault(), onClick: () => this.handleClick(tab, index), "aria-selected": index === this.internalActiveTabIndex ? 'true' : 'false', "aria-disabled": tab.disabled ? 'true' : 'false', role: "tab" }, (tab === null || tab === void 0 ? void 0 : tab.icon) ? h("ifx-icon", { icon: tab.icon }) : '', tab === null || tab === void 0 ? void 0 :
|
|
203
|
-
tab.header))), h("div", { key: '
|
|
203
|
+
tab.header))), h("div", { key: 'bb1cfb3caa7b178687c2cafd83008e5d81b74190', class: "active-border" })), h("div", { key: 'a55fc0392945da08aecea2937cf5dbf47c502881', class: "tab-content" }, Array.from(this.tabObjects).map((_, index) => (h("div", { style: { display: index === this.internalActiveTabIndex ? 'block' : 'none' } }, h("slot", { name: `tab-${index}` })))))));
|
|
204
204
|
}
|
|
205
205
|
static get is() { return "ifx-tabs"; }
|
|
206
206
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
export class Tag {
|
|
3
3
|
render() {
|
|
4
|
-
return (h("div", { key: '
|
|
4
|
+
return (h("div", { key: 'ba6a7ab29dc273bc85d490d5197a32828c00b773', "aria-label": "a tag", class: "container" }, this.icon && (h("ifx-icon", { key: '288f2bc03f55df934c660069837355af2a03d12a', icon: this.icon })), h("a", { key: '26cbe701f93f09b6acf8a52908a844d2b683b400', href: "javascript:void(null);", class: "label-wrapper" }, h("p", { key: '410e03ea48a0a7c2655ca7a97a0e2c06549494fa', class: "label" }, h("slot", { key: '369e2ff6d2d4f4d10518512ff129c6fcdbcb2144' })))));
|
|
5
5
|
}
|
|
6
6
|
static get is() { return "ifx-tag"; }
|
|
7
7
|
static get encapsulation() { return "shadow"; }
|
|
@@ -128,7 +128,7 @@ export class Template {
|
|
|
128
128
|
}
|
|
129
129
|
}
|
|
130
130
|
render() {
|
|
131
|
-
return (h("div", { key: '
|
|
131
|
+
return (h("div", { key: '846a13427fd8ac957e2ed543167f3679274c110d' }, this.isTemplatePage
|
|
132
132
|
?
|
|
133
133
|
h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError &&
|
|
134
134
|
h("div", null, h("h3", null, "Your repository is getting ready.."), h("p", null, "This will only take a minute.")), this.isLoading && !this.repoError && h("div", null, h("ifx-spinner", { variant: 'default', size: 's' })), this.repoUrl && h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository"), this.repoError && h("div", null, this.repoError))
|
|
@@ -40,7 +40,7 @@ export class TemplatesUI {
|
|
|
40
40
|
alertWrapper.classList.remove('show');
|
|
41
41
|
}
|
|
42
42
|
render() {
|
|
43
|
-
return (h("div", { key: '
|
|
43
|
+
return (h("div", { key: 'f75693e185819705bae623f31dafbff315220c60', class: 'templates__container' }, h("div", { key: '8ebe1415e39feca220a2e8d7fd87f4e2a6641e71', class: "back__btn-wrapper" }, h("ifx-icon-button", { key: 'f5286ef00280a6d7a6cc4e6badebb6b712fcd6ab', onClick: () => this.filterTemplates(false), shape: "round", variant: "tertiary", icon: "arrow-left-16", target: "_blank", size: "m" }), h("div", { key: '979b3580a1c8badc0ab024f46fbd184885d58a4c', class: "alert__wrapper" }, h("ifx-alert", { key: 'f3f74eb9d0c94205a589e4bb96660a0c1df6ae1c', onClick: () => this.closeAlert(), "aria-live": "assertive", variant: "danger", icon: "c-info-24" }, "All fields are mandatory"))), h("h2", { key: 'a01fa5cad78d573de82f144a8c18d9447b6a76fe', class: "templates__title" }, "Choose your template"), h("div", { key: '75fca148564ce0e1b17068001f3afa8d5d137626', class: "templates__wrapper" }, h("ifx-template", { key: '101dafae88c029f99d8982fc6653f32c07db5b27', name: 'template-01', thumbnail: this.tableTemplate }), h("ifx-template", { key: '6e308c29458a87aceb1b720217a3a2478fc4041e', name: 'template-02', thumbnail: this.wizardTemplate }))));
|
|
44
44
|
}
|
|
45
45
|
static get is() { return "ifx-templates-ui"; }
|
|
46
46
|
static get encapsulation() { return "shadow"; }
|
|
@@ -47,12 +47,12 @@ export class TextField {
|
|
|
47
47
|
this.handleTypeProp();
|
|
48
48
|
}
|
|
49
49
|
render() {
|
|
50
|
-
return (h("div", { key: '
|
|
50
|
+
return (h("div", { key: '81ef2fbe22ad30e688fdd6891439b09de2fcbf65', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '44a1992e5fbcd08273f2e017a05d072680fcf33c', class: "textInput__top-wrapper" }, h("label", { key: 'cbac0935435ed094c204b36c024d94bfcacef510', htmlFor: this.internalId }, h("slot", { key: '7d4fbcaec9be70cdb97bced7d32403bb26f1b9f8' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: '4d64d4b7a06be02b2233d3f3476ec5c421c10ac7', class: "textInput__bottom-wrapper" }, h("div", { key: '74ac0bceddc78b015d94b88ca75241d32aa2c5db', class: "input-container" }, this.icon && (h("ifx-icon", { key: '8553027b5d228fbb24e55fe9558fd7d89455498c', class: 'input-icon', icon: this.icon })), h("input", { key: 'b51b63c21d2597f3b051bc8d7fdedbd2aaff357d', ref: (el) => (this.inputElement = el), disabled: this.disabled, autocomplete: this.autocomplete, type: this.internalType, id: this.internalId, value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
|
|
51
51
|
${this.error ? 'error' : ""}
|
|
52
52
|
${this.size === "s" ? "input-s" : ""}
|
|
53
|
-
${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: '
|
|
54
|
-
h("div", { key: '
|
|
55
|
-
h("div", { key: '
|
|
53
|
+
${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: 'aa9d66fa212665006fb1696ddb8a9af2207ce4a0', class: "delete-icon", icon: "cremove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
|
|
54
|
+
h("div", { key: '5af9536c5b4766c4e53be1e4bb1d3dacbbd4c6a6', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
|
|
55
|
+
h("div", { key: 'f769b75fe6df50d867979af164ad4cd143285cb1', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
|
|
56
56
|
}
|
|
57
57
|
static get is() { return "ifx-text-field"; }
|
|
58
58
|
static get encapsulation() { return "shadow"; }
|
|
@@ -44,7 +44,7 @@ export class TextArea {
|
|
|
44
44
|
}
|
|
45
45
|
render() {
|
|
46
46
|
var _a, _b;
|
|
47
|
-
return (h(Host, { key: '
|
|
47
|
+
return (h(Host, { key: 'ad4f07a4ea16d1fd510bcb6e0cc0918a82f73bc3', class: `wrapper--${this.error ? 'error' : ''} wrapper--${this.disabled ? 'disabled' : ''}` }, h("label", { key: '041c9fb73cfff0d47bc197846ae70ec9c5ca35b4', class: 'wrapper__label', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 : _a.trim()), h("div", { key: 'b5db9b815a243f6b24907281c141a0b683f1726f', class: 'wrapper__textarea' }, h("textarea", { key: 'bdf09d868728934ce876497b636211cd1a1eb942', "aria-label": 'a textarea', "aria-value": this.value, "aria-disabled": this.disabled, id: this.inputId, style: { resize: this.resize }, name: this.name ? this.name : this.inputId, cols: this.cols, rows: this.rows, maxlength: this.maxlength, wrap: this.wrap, disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, onInput: (e) => this.handleOnInput(e) })), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: '42d3db3b95dfe23f296261bdbda67a95257185f6', class: 'wrapper__caption' }, this.caption.trim()))));
|
|
48
48
|
}
|
|
49
49
|
static get is() { return "ifx-textarea"; }
|
|
50
50
|
static get encapsulation() { return "shadow"; }
|
|
@@ -148,10 +148,10 @@ export class Tooltip {
|
|
|
148
148
|
'tooltip-extended': true,
|
|
149
149
|
'visible': this.tooltipVisible,
|
|
150
150
|
};
|
|
151
|
-
return (h("div", { key: '
|
|
152
|
-
h("div", { key: '
|
|
153
|
-
h("div", { key: '
|
|
154
|
-
h("svg", { class: "extended_icon", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24" }, h("path", { stroke: "#fff", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.5 2.5h-16a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-16a2 2 0 0 0-2-2Z" }), h("path", { stroke: "#fff", d: "M19 17H6l2.5-4 2.097 2.516.405.486.379-.506 4.118-5.49.003-.002L19 17Z" }), h("path", { fill: "#fff", d: "M10 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" }))), h("div", { key: '
|
|
151
|
+
return (h("div", { key: '3b8c0a5958c6f9bd8050dabe86794fad3945a11e', "aria-label": "a tooltip showing important information", "aria-value": this.header, class: "tooltip__container" }, h("slot", { key: 'f21eadbe48f312be595e035aeabb4518c27794ba' }), this.variant.toLowerCase() === 'dismissible' && h("div", { key: 'a0540f0f7d9b269ee3adec89fefc49c09b12c7bc', class: tooltipDismissible }, h("button", { key: '70aa5956d5e91e1867c6a781b3956e1f3a174c6a', "aria-label": "Close Tooltip", class: "close-button", onClick: this.onDismissClick }, h("ifx-icon", { key: '07f91bffdd259f18069ade3755dc5169c4f11e1e', icon: "cross16" })), h("div", { key: 'e5ccd4c4b59d93375441b29488ae50bdd5ea3f5b', class: "tooltip-dismissible-content" }, this.header && h("div", { key: 'b3c3b195688357c06c5257f80923c8bafdd62a1a', class: "tooltip-dismissible-header" }, this.header), h("div", { key: '27c01fef25ffe1bffbebb347c5bae43acd6b2c6b', class: "tooltip-dismissible-body" }, this.text)), h("svg", { key: '6199d757b56e3e365f156dccdc5c86e7ef9c4e25', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '11d4c52a83828afeebbac98031259f0b14482fec', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'compact' &&
|
|
152
|
+
h("div", { key: 'd8f6a06c2e9d84b2752013d78c5b5ab5759df617', class: tooltipCompact }, this.text, h("svg", { key: '3d37dc4c80e41659533bf53d63176d9cda93bdef', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'efdcc135932f3f148b107597bb4b7a8218ec2ea7', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'extended' &&
|
|
153
|
+
h("div", { key: 'bd23b388aedf1cd7fc80e6a57bb043f0eb706c00', class: tooltipExtended }, h("slot", { key: 'a287aab9832b2d22ac1c9c6ccd4b9a7fe1a88e1c', name: "icon" }, this.icon ? h("div", { class: "extended_icon" }, h("ifx-icon", { icon: this.icon })) :
|
|
154
|
+
h("svg", { class: "extended_icon", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24" }, h("path", { stroke: "#fff", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.5 2.5h-16a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-16a2 2 0 0 0-2-2Z" }), h("path", { stroke: "#fff", d: "M19 17H6l2.5-4 2.097 2.516.405.486.379-.506 4.118-5.49.003-.002L19 17Z" }), h("path", { fill: "#fff", d: "M10 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" }))), h("div", { key: '596675881c90111f1c8f4dd26f277ae647d76507', class: "tooltip-extended-content" }, this.header && h("div", { key: '54837eab014cc174f06980883827e6c9bb74c3e0', class: "tooltip-extended-header" }, this.header), h("div", { key: '6317ecd46ee6ad8d91f214f9a487511ecabda638', class: "tooltip-extended-body" }, this.text)), h("svg", { key: '2b6d3104824919a9ce5c9b608cae05b9cf1a6575', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2030a14c358f513f7d7e34a65adb1ff30c4b12ce', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" })))));
|
|
155
155
|
}
|
|
156
156
|
static get is() { return "ifx-tooltip"; }
|
|
157
157
|
static get encapsulation() { return "shadow"; }
|