@iamproperty/components 7.1.0--beta7 → 7.2.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/assets/css/components/actionbar.component.css +1 -0
- package/assets/css/components/actionbar.component.css.map +1 -0
- package/assets/css/components/actionbar.global.css +1 -1
- package/assets/css/components/actionbar.global.css.map +1 -1
- package/assets/css/components/address-lookup.css +1 -1
- package/assets/css/components/address-lookup.css.map +1 -1
- package/assets/css/components/barchart.component.css +1 -1
- package/assets/css/components/barchart.component.css.map +1 -1
- package/assets/css/components/bento-grid.component.css +1 -0
- package/assets/css/components/bento-grid.component.css.map +1 -0
- package/assets/css/components/card.component.css +1 -1
- package/assets/css/components/card.component.css.map +1 -1
- package/assets/css/components/carousel.component.css +1 -1
- package/assets/css/components/carousel.component.css.map +1 -1
- package/assets/css/components/carousel.config.css +1 -1
- package/assets/css/components/carousel.config.css.map +1 -1
- package/assets/css/components/charts.config.css +1 -1
- package/assets/css/components/charts.config.css.map +1 -1
- package/assets/css/components/charts.css +1 -1
- package/assets/css/components/charts.css.map +1 -1
- package/assets/css/components/charts.module.css +1 -1
- package/assets/css/components/charts.module.css.map +1 -1
- package/assets/css/components/collapsible-side.css +1 -1
- package/assets/css/components/collapsible-side.css.map +1 -1
- package/assets/css/components/doughnutchart.component.css +1 -0
- package/assets/css/components/doughnutchart.component.css.map +1 -0
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/header.css.map +1 -1
- package/assets/css/components/inline-edit.preload.css +1 -1
- package/assets/css/components/inline-edit.preload.css.map +1 -1
- package/assets/css/components/marketing.css.map +1 -1
- package/assets/css/components/menu.component.css +1 -0
- package/assets/css/components/menu.component.css.map +1 -0
- package/assets/css/components/menu.css +1 -0
- package/assets/css/components/menu.css.map +1 -0
- package/assets/css/components/multi-step.component.css.map +1 -1
- package/assets/css/components/multiselect.preload.css +1 -1
- package/assets/css/components/multiselect.preload.css.map +1 -1
- package/assets/css/components/nav.component.css +1 -0
- package/assets/css/components/nav.component.css.map +1 -0
- package/assets/css/components/nav.docs.css.map +1 -1
- package/assets/css/components/nav.global.css.map +1 -1
- package/assets/css/components/nav.old.css +1 -1
- package/assets/css/components/nav.old.css.map +1 -1
- package/assets/css/components/nav.preload.css +1 -1
- package/assets/css/components/nav.preload.css.map +1 -1
- package/assets/css/components/notification.css +1 -1
- package/assets/css/components/notification.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/property-searchbar.css.map +1 -1
- package/assets/css/components/slider.css +1 -1
- package/assets/css/components/slider.css.map +1 -1
- package/assets/css/components/snapshot.css.map +1 -1
- package/assets/css/components/stepper.css.map +1 -1
- package/assets/css/components/{table.css → table.component.css} +1 -1
- package/assets/css/components/table.component.css.map +1 -0
- package/assets/css/components/table.global.css +1 -1
- package/assets/css/components/table.global.css.map +1 -1
- package/assets/css/components/tabs.component.css +1 -0
- package/assets/css/components/tabs.component.css.map +1 -0
- package/assets/css/components/tabs.css.map +1 -1
- package/assets/css/components/testimonial.css.map +1 -1
- package/assets/css/components/timeline.css.map +1 -1
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/mobile-core.min.css +1 -0
- package/assets/css/mobile-core.min.css.map +1 -0
- package/assets/css/mobile.min.css +1 -0
- package/assets/css/mobile.min.css.map +1 -0
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/_global.js +0 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/accordion/accordion.component.min.js.map +1 -1
- package/assets/js/components/actionbar/actionbar.component.js +86 -8
- package/assets/js/components/actionbar/actionbar.component.min.js +19 -6
- package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.js +17 -18
- package/assets/js/components/address-lookup/address-lookup.component.min.js +5 -5
- package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.js +0 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +4 -4
- package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -1
- package/assets/js/components/barchart/barchart.component.js +2 -3
- package/assets/js/components/barchart/barchart.component.min.js +8 -4
- package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
- package/assets/js/components/bento-grid/bento-grid.component.js +50 -0
- package/assets/js/components/bento-grid/bento-grid.component.min.js +15 -0
- package/assets/js/components/bento-grid/bento-grid.component.min.js.map +1 -0
- package/assets/js/components/card/card.component.js +10 -13
- package/assets/js/components/card/card.component.min.js +7 -7
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/carousel/carousel.component.js +4 -5
- package/assets/js/components/carousel/carousel.component.min.js +4 -4
- package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
- package/assets/js/components/chart/chart.component.js +1 -5
- package/assets/js/components/collapsible-side/collapsible-side.component.js +4 -5
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +4 -4
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
- package/assets/js/components/doughnutchart/doughnutchart.component.js +70 -0
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +25 -0
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js.map +1 -0
- package/assets/js/components/fileupload/fileupload.component.js +2 -3
- package/assets/js/components/fileupload/fileupload.component.min.js +6 -6
- package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
- package/assets/js/components/filter-card/filter-card.component.js +3 -4
- package/assets/js/components/filter-card/filter-card.component.min.js +4 -4
- package/assets/js/components/filter-card/filter-card.component.min.js.map +1 -1
- package/assets/js/components/filterlist/filterlist.component.js +0 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +3 -3
- package/assets/js/components/filterlist/filterlist.component.min.js.map +1 -1
- package/assets/js/components/header/header.component.js +0 -1
- package/assets/js/components/header/header.component.min.js +1 -1
- package/assets/js/components/header/header.component.min.js.map +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.js +7 -8
- package/assets/js/components/inline-edit/inline-edit.component.min.js +4 -4
- package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
- package/assets/js/components/marketing/marketing.component.js +0 -1
- package/assets/js/components/marketing/marketing.component.min.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
- package/assets/js/components/menu/menu.component.js +200 -0
- package/assets/js/components/menu/menu.component.min.js +77 -0
- package/assets/js/components/menu/menu.component.min.js.map +1 -0
- package/assets/js/components/multi-step/multi-step.component.js +10 -10
- package/assets/js/components/multi-step/multi-step.component.min.js +13 -0
- package/assets/js/components/multi-step/multi-step.component.min.js.map +1 -0
- package/assets/js/components/multiselect/multiselect.component.js +10 -10
- package/assets/js/components/multiselect/multiselect.component.min.js +3 -3
- package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
- package/assets/js/components/nav/nav.component.js +7 -7
- package/assets/js/components/nav/nav.component.min.js +7 -7
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.js +3 -3
- package/assets/js/components/notification/notification.component.min.js +4 -4
- package/assets/js/components/notification/notification.component.min.js.map +1 -1
- package/assets/js/components/pagination/pagination.component.js +3 -4
- package/assets/js/components/pagination/pagination.component.min.js +4 -4
- package/assets/js/components/pagination/pagination.component.min.js.map +1 -1
- package/assets/js/components/record-card/record-card.component.js +6 -8
- package/assets/js/components/record-card/record-card.component.min.js +4 -4
- package/assets/js/components/record-card/record-card.component.min.js.map +1 -1
- package/assets/js/components/search/search.component.js +9 -6
- package/assets/js/components/search/search.component.min.js +8 -5
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.js +8 -8
- package/assets/js/components/slider/slider.component.min.js +5 -5
- package/assets/js/components/slider/slider.component.min.js.map +1 -1
- package/assets/js/components/table/table.component.js +8 -9
- package/assets/js/components/table/table.component.min.js +7 -7
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.js +1 -2
- package/assets/js/components/tabs/tabs.component.min.js +3 -3
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/video-card/video-card.component.js +4 -3
- package/assets/js/components/video-card/video-card.component.min.js +3 -3
- package/assets/js/components/video-card/video-card.component.min.js.map +1 -1
- package/assets/js/modules/applied-filters.js +8 -9
- package/assets/js/modules/carousel.js +9 -10
- package/assets/js/modules/chart.js +5 -3
- package/assets/js/modules/chart.module.js +108 -1
- package/assets/js/modules/dialogs.js +6 -7
- package/assets/js/modules/drawer.js +1 -2
- package/assets/js/modules/dynamicEvents.js +7 -8
- package/assets/js/modules/fileupload.js +7 -7
- package/assets/js/modules/filterlist.js +3 -4
- package/assets/js/modules/form.js +12 -13
- package/assets/js/modules/helpers.js +3 -5
- package/assets/js/modules/inputs.js +6 -9
- package/assets/js/modules/nav.js +3 -4
- package/assets/js/modules/notification.js +2 -3
- package/assets/js/modules/orderablelist.js +0 -1
- package/assets/js/modules/table.js +80 -42
- package/assets/js/modules/tabs.js +3 -6
- package/assets/js/scripts.bundle.js +3 -3
- package/assets/js/scripts.bundle.js.map +1 -1
- package/assets/js/scripts.bundle.min.js +2 -2
- package/assets/js/scripts.bundle.min.js.map +1 -1
- package/assets/js/scripts.js +64 -6
- package/assets/js/tests/card.spec.js +14 -0
- package/assets/js/tests/carousel.spec.js +60 -0
- package/assets/js/tests/chart.spec.js +7 -5
- package/assets/js/tests/fileupload.spec.js +22 -0
- package/assets/js/tests/multistep.spec.js +68 -0
- package/assets/sass/_bs_grid.scss +4 -1
- package/assets/sass/_components.scss +323 -100
- package/assets/sass/_corefiles.scss +42 -18
- package/assets/sass/_elements.scss +98 -18
- package/assets/sass/_example.scss +61 -0
- package/assets/sass/_func.scss +5 -13
- package/assets/sass/_functions/bs_utilities.scss +43 -39
- package/assets/sass/_functions/functions.scss +66 -52
- package/assets/sass/_functions/mixins.scss +84 -100
- package/assets/sass/_functions/utility-mixins.scss +56 -44
- package/assets/sass/_functions/variables.scss +90 -1659
- package/assets/sass/_functions/variables_old.scss +1701 -0
- package/assets/sass/_grid.scss +19 -5
- package/assets/sass/_tests/func.spec.scss +1 -37
- package/assets/sass/_tests/mixins.spec.scss +1 -77
- package/assets/sass/_tests/typography.spec.scss +1 -1
- package/assets/sass/_utilities.scss +15 -5
- package/assets/sass/_utility-mixins.scss +6 -1
- package/assets/sass/components/{actionbar.scss → actionbar.component.scss} +82 -16
- package/assets/sass/components/actionbar.global.scss +28 -14
- package/assets/sass/components/address-lookup.scss +6 -0
- package/assets/sass/components/barchart.component.scss +7 -20
- package/assets/sass/components/bento-grid.component.scss +91 -0
- package/assets/sass/components/carousel.config.scss +64 -58
- package/assets/sass/components/charts.config.scss +73 -67
- package/assets/sass/components/charts.module.scss +128 -97
- package/assets/sass/components/charts.scss +43 -42
- package/assets/sass/components/collapsible-side.scss +29 -27
- package/assets/sass/components/doughnutchart.component.scss +205 -0
- package/assets/sass/components/fileupload.scss +4 -3
- package/assets/sass/components/header.scss +5 -5
- package/assets/sass/components/inline-edit.preload.scss +108 -102
- package/assets/sass/components/menu.component.scss +101 -0
- package/assets/sass/components/menu.scss +21 -0
- package/assets/sass/components/multi-step.component.scss +5 -3
- package/assets/sass/components/multiselect.preload.scss +36 -30
- package/assets/sass/components/{nav.scss → nav.component.scss} +41 -21
- package/assets/sass/components/nav.docs.scss +1 -1
- package/assets/sass/components/nav.global.scss +13 -11
- package/assets/sass/components/nav.old.scss +21 -24
- package/assets/sass/components/nav.preload.scss +40 -34
- package/assets/sass/components/notification.scss +9 -5
- package/assets/sass/components/pagination.scss +6 -0
- package/assets/sass/components/property-searchbar.scss +7 -7
- package/assets/sass/components/slider.scss +2 -0
- package/assets/sass/components/snapshot.scss +2 -2
- package/assets/sass/components/stepper.scss +7 -7
- package/assets/sass/components/table.global.scss +57 -1
- package/assets/sass/components/tabs.component.scss +5 -0
- package/assets/sass/components/tabs.scss +7 -3
- package/assets/sass/components/testimonial.scss +7 -7
- package/assets/sass/components/timeline.scss +1 -1
- package/assets/sass/core.scss +13 -4
- package/assets/sass/elements/admin-panel.scss +199 -185
- package/assets/sass/elements/badge-tag.scss +87 -81
- package/assets/sass/elements/brand.scss +67 -61
- package/assets/sass/elements/buttons--action.scss +55 -0
- package/assets/sass/elements/buttons--compact.scss +135 -0
- package/assets/sass/elements/buttons--global.scss +322 -0
- package/assets/sass/elements/buttons--secondary.scss +24 -0
- package/assets/sass/elements/buttons--tertiary.scss +57 -0
- package/assets/sass/elements/buttons.scss +29 -503
- package/assets/sass/elements/container.scss +157 -151
- package/assets/sass/elements/details.scss +147 -138
- package/assets/sass/elements/dialog.scss +36 -30
- package/assets/sass/elements/forms.scss +1061 -1047
- package/assets/sass/elements/icons.scss +23 -17
- package/assets/sass/elements/links.scss +131 -116
- package/assets/sass/elements/lists.scss +270 -264
- package/assets/sass/elements/media.scss +19 -13
- package/assets/sass/elements/modal.scss +336 -330
- package/assets/sass/elements/popover.scss +163 -152
- package/assets/sass/elements/progress.scss +173 -162
- package/assets/sass/elements/table.element.scss +115 -109
- package/assets/sass/elements/tooltips.scss +87 -80
- package/assets/sass/elements/type.scss +172 -160
- package/assets/sass/email.scss +0 -1
- package/assets/sass/error.scss +15 -13
- package/assets/sass/foundations/reboot.scss +176 -170
- package/assets/sass/foundations/root.scss +136 -125
- package/assets/sass/helpers/max-height.scss +2 -2
- package/assets/sass/main.scss +14 -6
- package/assets/sass/mobile-core.scss +14 -0
- package/assets/sass/mobile.scss +16 -0
- package/assets/sass/templates/auth.scss +88 -83
- package/assets/sass/templates/form.scss +68 -59
- package/assets/ts/components/_global.ts +2 -3
- package/assets/ts/components/actionbar/actionbar.component.ts +94 -2
- package/assets/ts/components/address-lookup/address-lookup.component.ts +21 -22
- package/assets/ts/components/applied-filters/applied-filters.component.ts +1 -2
- package/assets/ts/components/barchart/barchart.component.ts +3 -5
- package/assets/ts/components/bento-grid/README.md +31 -0
- package/assets/ts/components/bento-grid/bento-grid.component.ts +67 -0
- package/assets/ts/components/card/card.component.ts +13 -16
- package/assets/ts/components/carousel/carousel.component.ts +5 -7
- package/assets/ts/components/chart/chart.component.ts +4 -9
- package/assets/ts/components/collapsible-side/collapsible-side.component.ts +5 -6
- package/assets/ts/components/doughnutchart/doughnutchart.component.ts +85 -0
- package/assets/ts/components/fileupload/fileupload.component.ts +5 -6
- package/assets/ts/components/filter-card/filter-card.component.ts +4 -5
- package/assets/ts/components/filterlist/filterlist.component.ts +1 -2
- package/assets/ts/components/header/header.component.ts +1 -3
- package/assets/ts/components/inline-edit/inline-edit.component.ts +8 -11
- package/assets/ts/components/marketing/marketing.component.ts +1 -3
- package/assets/ts/components/menu/menu.component.ts +222 -0
- package/assets/ts/components/multi-step/multi-step.component.ts +19 -23
- package/assets/ts/components/multiselect/multiselect.component.ts +13 -14
- package/assets/ts/components/nav/nav.component.ts +8 -9
- package/assets/ts/components/notification/notification.component.ts +3 -3
- package/assets/ts/components/pagination/pagination.component.ts +7 -8
- package/assets/ts/components/record-card/record-card.component.ts +9 -11
- package/assets/ts/components/search/search.component.ts +12 -9
- package/assets/ts/components/slider/slider.component.ts +9 -10
- package/assets/ts/components/table/table.component.ts +14 -16
- package/assets/ts/components/tabs/tabs.component.ts +2 -3
- package/assets/ts/components/video-card/video-card.component.ts +13 -12
- package/assets/ts/modules/applied-filters.ts +10 -11
- package/assets/ts/modules/card.module.ts +1 -1
- package/assets/ts/modules/carousel.ts +13 -15
- package/assets/ts/modules/chart.module.ts +152 -19
- package/assets/ts/modules/chart.ts +26 -24
- package/assets/ts/modules/dialogs.ts +10 -13
- package/assets/ts/modules/drawer.ts +1 -2
- package/assets/ts/modules/dynamicEvents.ts +12 -14
- package/assets/ts/modules/fileupload.ts +10 -10
- package/assets/ts/modules/filterlist.ts +6 -7
- package/assets/ts/modules/form.ts +16 -17
- package/assets/ts/modules/helpers.ts +18 -21
- package/assets/ts/modules/inputs.ts +15 -18
- package/assets/ts/modules/nav.ts +4 -5
- package/assets/ts/modules/notification.ts +7 -8
- package/assets/ts/modules/orderablelist.ts +3 -4
- package/assets/ts/modules/pagination.ts +1 -1
- package/assets/ts/modules/table.ts +103 -60
- package/assets/ts/modules/tabs.ts +5 -8
- package/assets/ts/scripts.ts +70 -6
- package/assets/ts/tests/card.spec.ts +19 -0
- package/assets/ts/tests/carousel.spec.ts +66 -0
- package/assets/ts/tests/chart.spec.ts +9 -6
- package/assets/ts/tests/fileupload.spec.ts +30 -0
- package/assets/ts/tests/multistep.spec.ts +78 -0
- package/dist/components.es.js +1258 -1063
- package/dist/components.umd.js +473 -195
- package/package.json +44 -49
- package/src/components/BentoGrid/BentoGrid.vue +20 -0
- package/src/components/DoughnutChart/DoughnutChart.vue +23 -0
- package/src/components/FileUpload/FileUpload.vue +4 -1
- package/src/components/Menu/Menu.vue +22 -0
- package/src/components/Tabs/Tabs.vue +0 -4
- package/src/index.js +25 -19
- package/assets/css/components/actionbar.css +0 -1
- package/assets/css/components/actionbar.css.map +0 -1
- package/assets/css/components/nav.css +0 -1
- package/assets/css/components/nav.css.map +0 -1
- package/assets/css/components/table.css.map +0 -1
- package/assets/js/components.bundle.js +0 -5
- package/assets/js/components.bundle.js.map +0 -1
- package/assets/js/components.js +0 -57
- package/assets/js/modules/file-upload.js +0 -32
- package/assets/ts/components.ts +0 -62
- package/assets/ts/modules/file-upload.ts +0 -52
- package/dist/style.css +0 -1
- /package/assets/sass/components/{table.scss → table.component.scss} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-card.component.min.js","sources":["../_global.js","../../modules/card.module.js","filter-card.component.js"],"sourcesContent":["// @ts-nocheck\nexport const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const cardHTML = `<div class=\"card__head\" part=\"head\">\n <slot name=\"head\"></slot>\n</div>\n<div class=\"card__badges\"><slot name=\"badges\"></slot></div>\n<slot name=\"checkbox\" class=\"activate-prevent-hover\"></slot>\n<div class=\"card__body\" part=\"body\">\n <slot></slot>\n <slot name=\"secondary\" part=\"secondary\"></slot>\n</div>\n<div class=\"card__details\" part=\"details\">\n <slot name=\"details\"></slot>\n</div>\n<div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n</div>`;\nexport const setupCard = (cardComponent) => {\n cardComponent.classList.add('card');\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n if (cardComponent.hasAttribute('data-image')) {\n cardHead.innerHTML += `<img src=\"${cardComponent.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" part=\"image\" />`;\n }\n // Inset the HTML for the data total or icon fallback\n if (cardComponent.hasAttribute('data-total')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\">${cardComponent.getAttribute('data-total')}</div>`);\n }\n else if (cardComponent.querySelector('[slot=\"total-icon\"]')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\"><slot name=\"total-icon\"></slot></div>`);\n }\n if (!cardComponent.querySelector('[slot=\"badges\"]')) {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.add('empty');\n }\n else {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.remove('empty');\n }\n};\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\n// @ts-nocheck\nimport { trackComponent, trackComponentRegistered } from '../_global.js';\nimport { cardHTML, setupCard } from '../../modules/card.module.js';\ntrackComponentRegistered('iam-filter-card');\nclass iamFilerCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/filter-card.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n ${cardHTML}\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n const cardComponent = this;\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n setupCard(cardComponent);\n // Dispatch events of selecting checkboxes\n const checkbox = cardComponent.parentElement.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.addEventListener('change', (event) => {\n if (checkbox.checked) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.add('active');\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.remove('active');\n }\n });\n }\n if (cardComponent.parentElement.matches('button')) {\n const button = cardComponent.parentElement;\n button.addEventListener('click', (event) => {\n if (!cardComponent.classList.contains('active')) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'button name': button.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.add('active');\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'button name': button.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.remove('active');\n }\n });\n }\n trackComponent(cardComponent, 'iam-filter-card', ['select-card', 'unselect-card']);\n });\n }\n}\nexport default iamFilerCard;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","cardHTML","setupCard","cardComponent","cardHead","cardBody","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","iamFilerCard","template","checkbox","customEvent","button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"filter-card.component.min.js","sources":["../_global.js","../../modules/card.module.js","filter-card.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const cardHTML = `<div class=\"card__head\" part=\"head\">\n <slot name=\"head\"></slot>\n</div>\n<div class=\"card__badges\"><slot name=\"badges\"></slot></div>\n<slot name=\"checkbox\" class=\"activate-prevent-hover\"></slot>\n<div class=\"card__body\" part=\"body\">\n <slot></slot>\n <slot name=\"secondary\" part=\"secondary\"></slot>\n</div>\n<div class=\"card__details\" part=\"details\">\n <slot name=\"details\"></slot>\n</div>\n<div class=\"card__footer\" part=\"footer\">\n <slot name=\"footer\"></slot>\n</div>`;\nexport const setupCard = (cardComponent) => {\n cardComponent.classList.add('card');\n const cardHead = cardComponent.shadowRoot.querySelector('.card__head');\n const cardBody = cardComponent.shadowRoot.querySelector('.card__body');\n if (cardComponent.hasAttribute('data-image')) {\n cardHead.innerHTML += `<img src=\"${cardComponent.getAttribute('data-image')}\" alt=\"\" loading=\"lazy\" part=\"image\" />`;\n }\n // Inset the HTML for the data total or icon fallback\n if (cardComponent.hasAttribute('data-total')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\">${cardComponent.getAttribute('data-total')}</div>`);\n }\n else if (cardComponent.querySelector('[slot=\"total-icon\"]')) {\n cardBody.insertAdjacentHTML('beforeend', `<div class=\"card__total\"><slot name=\"total-icon\"></slot></div>`);\n }\n if (!cardComponent.querySelector('[slot=\"badges\"]')) {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.add('empty');\n }\n else {\n cardComponent.shadowRoot.querySelector('.card__badges').classList.remove('empty');\n }\n};\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n return new (P || (P = Promise))(function (resolve, reject) {\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n step((generator = generator.apply(thisArg, _arguments || [])).next());\n });\n};\nimport { trackComponent, trackComponentRegistered } from '../_global.js';\nimport { cardHTML, setupCard } from '../../modules/card.module.js';\ntrackComponentRegistered('iam-filter-card');\nclass iamFilerCard extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/filter-card.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n ${cardHTML}\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n return __awaiter(this, void 0, void 0, function* () {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const cardComponent = this;\n setupCard(cardComponent);\n // Dispatch events of selecting checkboxes\n const checkbox = cardComponent.parentElement.querySelector('input[type=\"checkbox\"]');\n if (checkbox) {\n checkbox.addEventListener('change', () => {\n if (checkbox.checked) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.add('active');\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'Card value': checkbox.value, 'input name': checkbox.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.remove('active');\n }\n });\n }\n if (cardComponent.parentElement.matches('button')) {\n const button = cardComponent.parentElement;\n button.addEventListener('click', () => {\n if (!cardComponent.classList.contains('active')) {\n const customEvent = new CustomEvent('select-card', {\n detail: { 'button name': button.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.add('active');\n }\n else {\n const customEvent = new CustomEvent('unselect-card', {\n detail: { 'button name': button.getAttribute('name') },\n });\n cardComponent.dispatchEvent(customEvent);\n cardComponent.classList.remove('active');\n }\n });\n }\n trackComponent(cardComponent, 'iam-filter-card', ['select-card', 'unselect-card']);\n });\n }\n}\nexport default iamFilerCard;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","cardHTML","setupCard","cardComponent","cardHead","cardBody","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","iamFilerCard","template","checkbox","customEvent","button"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.2.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/function
|
|
4
|
+
*/function r(s,t){i(s,t)}function i(s,t){let e;t.addEventListener("keyup",()=>{clearTimeout(e),e=setTimeout(function(){o(s,t.value)},500)}),t.addEventListener("change",()=>{clearTimeout(e),o(s,t.value)})}const o=function(s,t){Array.from(s.querySelectorAll(":scope > li")).forEach(e=>{const a=e.textContent.toLowerCase();e.classList.add("d-none"),a.includes(t.toLowerCase())&&e.classList.remove("d-none")}),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Filtered list",value:t})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"filterlist"});class n extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
|
|
5
5
|
<style>
|
|
6
6
|
@import "${e}";
|
|
7
7
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
@@ -28,5 +28,5 @@
|
|
|
28
28
|
<div class="list__wrapper" part="wrapper">
|
|
29
29
|
<slot></slot>
|
|
30
30
|
</div>
|
|
31
|
-
`,this.shadowRoot.appendChild(a.content.cloneNode(!0))}connectedCallback(){const t=this.classList.toString();this.shadowRoot.querySelector(".list__wrapper").setAttribute("class",`list__wrapper ${t}`),this.querySelector("i.fa-search")||(this.innerHTML+='<i class="fa fa-light fa-search" aria-hidden="true" slot="icon"></i>'),
|
|
31
|
+
`,this.shadowRoot.appendChild(a.content.cloneNode(!0))}connectedCallback(){const t=this.classList.toString();this.shadowRoot.querySelector(".list__wrapper").setAttribute("class",`list__wrapper ${t}`),this.querySelector("i.fa-search")||(this.innerHTML+='<i class="fa fa-light fa-search" aria-hidden="true" slot="icon"></i>'),r(this.querySelector("ul"),this.shadowRoot.querySelector("#search"))}}export{n as default};
|
|
32
32
|
//# sourceMappingURL=filterlist.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filterlist.component.min.js","sources":["../../modules/filterlist.js","filterlist.component.js"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"filterlist.component.min.js","sources":["../../modules/filterlist.js","filterlist.component.js"],"sourcesContent":["function filterlist(list, input) {\n addFilterlistEventListeners(list, input);\n}\nfunction addFilterlistEventListeners(list, input) {\n let timer;\n input.addEventListener('keyup', () => {\n clearTimeout(timer);\n timer = setTimeout(function () {\n filterTheList(list, input.value);\n }, 500);\n });\n input.addEventListener('change', () => {\n clearTimeout(timer);\n filterTheList(list, input.value);\n });\n}\nexport const filterTheList = function (list, searchTerm) {\n Array.from(list.querySelectorAll(':scope > li')).forEach((item) => {\n const content = item.textContent.toLowerCase();\n item.classList.add('d-none');\n if (content.includes(searchTerm.toLowerCase()))\n item.classList.remove('d-none');\n });\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'Filtered list',\n value: searchTerm,\n });\n};\nexport default filterlist;\n","import filterlist from '../../modules/filterlist.js';\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'filterlist',\n});\nclass iamFilterlist extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n :host {\n margin-bottom: 1rem;\n display:block;\n }\n :host(.mh-sm){\n max-height: none!important;\n }\n :host(.mh-md){\n max-height: none!important;\n }\n :host(.mh-lg){\n max-height: none!important;\n }\n </style>\n <div class=\"form-control__wrapper\">\n <label for=\"search\" class=\"visually-hidden\">Search</label>\n <span class=\"suffix\" role=\"presentation\"><slot name=\"icon\"></slot></span>\n <input name=\"search\" id=\"search\" type=\"text\" class=\"form-control\" autocomplete=\"off\" placeholder=\"Search\" part=\"search-input\" />\n </div>\n <div class=\"list__wrapper\" part=\"wrapper\">\n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const classList = this.classList.toString();\n this.shadowRoot.querySelector('.list__wrapper').setAttribute('class', `list__wrapper ${classList}`);\n if (!this.querySelector('i.fa-search'))\n this.innerHTML += '<i class=\"fa fa-light fa-search\" aria-hidden=\"true\" slot=\"icon\"></i>';\n filterlist(this.querySelector('ul'), this.shadowRoot.querySelector('#search'));\n }\n}\nexport default iamFilterlist;\n"],"names":["filterlist","list","input","addFilterlistEventListeners","timer","filterTheList","searchTerm","item","content","iamFilterlist","assetLocation","coreCSS","template","classList"],"mappings":";;;IAAA,SAASA,EAAWC,EAAMC,EAAO,CAC7BC,EAA4BF,EAAMC,CAAK,CAC3C,CACA,SAASC,EAA4BF,EAAMC,EAAO,CAC9C,IAAIE,EACJF,EAAM,iBAAiB,QAAS,IAAM,CAClC,aAAaE,CAAK,EAClBA,EAAQ,WAAW,UAAY,CAC3BC,EAAcJ,EAAMC,EAAM,KAAK,CAClC,EAAE,GAAG,CACd,CAAK,EACDA,EAAM,iBAAiB,SAAU,IAAM,CACnC,aAAaE,CAAK,EAClBC,EAAcJ,EAAMC,EAAM,KAAK,CACvC,CAAK,CACL,CACO,MAAMG,EAAgB,SAAUJ,EAAMK,EAAY,CACrD,MAAM,KAAKL,EAAK,iBAAiB,aAAa,CAAC,EAAE,QAASM,GAAS,CAC/D,MAAMC,EAAUD,EAAK,YAAY,YAAa,EAC9CA,EAAK,UAAU,IAAI,QAAQ,EACvBC,EAAQ,SAASF,EAAW,YAAW,CAAE,GACzCC,EAAK,UAAU,OAAO,QAAQ,CAC1C,CAAK,EAED,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,gBACP,MAAOD,CACf,CAAK,CACL,EC3BA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,YACb,CAAC,EACD,MAAMG,UAAsB,WAAY,CACpC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAChBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA,MAChB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAyBtE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,MAAMC,EAAY,KAAK,UAAU,SAAU,EAC3C,KAAK,WAAW,cAAc,gBAAgB,EAAE,aAAa,QAAS,iBAAiBA,CAAS,EAAE,EAC7F,KAAK,cAAc,aAAa,IACjC,KAAK,WAAa,wEACtBb,EAAW,KAAK,cAAc,IAAI,EAAG,KAAK,WAAW,cAAc,SAAS,CAAC,CACrF,CACA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.2.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["//
|
|
1
|
+
{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'header',\n});\nclass iamHeader extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/header.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"header-banner\">\n <picture>\n <img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" alt=\"\" lazy=\"\" />\n </picture>\n <div class=\"container\">\n <slot></slot>\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('bg-primary');\n const picture = this.shadowRoot.querySelector('picture');\n const source = this.shadowRoot.querySelector('picture img');\n if (this.hasAttribute('image'))\n source.setAttribute('src', this.getAttribute('image'));\n else\n picture.remove();\n }\n}\nexport default iamHeader;\n"],"names":["iamHeader","assetLocation","coreCSS","template","picture","source"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,QACb,CAAC,EACD,MAAMA,UAAkB,WAAY,CAChC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAEhBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA,MAEhB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAWtE,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,KAAK,UAAU,IAAI,YAAY,EAC/B,MAAMC,EAAU,KAAK,WAAW,cAAc,SAAS,EACjDC,EAAS,KAAK,WAAW,cAAc,aAAa,EACtD,KAAK,aAAa,OAAO,EACzBA,EAAO,aAAa,MAAO,KAAK,aAAa,OAAO,CAAC,EAErDD,EAAQ,OAAQ,CAC5B,CACA"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
// @ts-nocheck
|
|
2
1
|
// Data layer Web component created
|
|
3
2
|
window.dataLayer = window.dataLayer || [];
|
|
4
3
|
window.dataLayer.push({
|
|
@@ -37,10 +36,10 @@ class iamInlineEdit extends HTMLElement {
|
|
|
37
36
|
shadowRoot.appendChild(template.content.cloneNode(true));
|
|
38
37
|
}
|
|
39
38
|
connectedCallback() {
|
|
39
|
+
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
40
40
|
const inlineEdit = this;
|
|
41
41
|
const saveButton = this.shadowRoot.querySelector('#save');
|
|
42
42
|
const cancelButton = this.shadowRoot.querySelector('#cancel');
|
|
43
|
-
const label = this.querySelector('label');
|
|
44
43
|
const input = this.querySelector('input, textarea, select');
|
|
45
44
|
const preview = this.querySelector('.preview');
|
|
46
45
|
const statusSaving = this.shadowRoot.querySelector('#saving');
|
|
@@ -49,7 +48,7 @@ class iamInlineEdit extends HTMLElement {
|
|
|
49
48
|
// Save the original value for later
|
|
50
49
|
let originalValue = input.value;
|
|
51
50
|
// cancel
|
|
52
|
-
cancelButton.addEventListener('click', (
|
|
51
|
+
cancelButton.addEventListener('click', () => {
|
|
53
52
|
input.value = originalValue;
|
|
54
53
|
input.blur();
|
|
55
54
|
inlineEdit.blur();
|
|
@@ -61,7 +60,7 @@ class iamInlineEdit extends HTMLElement {
|
|
|
61
60
|
inlineEdit.dispatchEvent(cancelEvent);
|
|
62
61
|
});
|
|
63
62
|
// Save
|
|
64
|
-
saveButton.addEventListener('click', (
|
|
63
|
+
saveButton.addEventListener('click', () => {
|
|
65
64
|
if (inlineEdit.querySelector(':invalid')) {
|
|
66
65
|
inlineEdit.classList.add('was-validated');
|
|
67
66
|
return false;
|
|
@@ -96,7 +95,7 @@ class iamInlineEdit extends HTMLElement {
|
|
|
96
95
|
});
|
|
97
96
|
}
|
|
98
97
|
// Saved
|
|
99
|
-
inlineEdit.addEventListener('inline-edit-saved', (
|
|
98
|
+
inlineEdit.addEventListener('inline-edit-saved', () => {
|
|
100
99
|
setTimeout(() => {
|
|
101
100
|
statusSaving.classList.add('d-none');
|
|
102
101
|
statusSaved.classList.remove('d-none');
|
|
@@ -116,7 +115,7 @@ class iamInlineEdit extends HTMLElement {
|
|
|
116
115
|
});
|
|
117
116
|
// enter key saves
|
|
118
117
|
if (input.tagName === 'SELECT') {
|
|
119
|
-
input.addEventListener('change', (
|
|
118
|
+
input.addEventListener('change', () => {
|
|
120
119
|
originalValue = input.value;
|
|
121
120
|
const saveEvent = new CustomEvent('inline-edit-save', {
|
|
122
121
|
detail: { name: input.getAttribute('name'), value: input.value },
|
|
@@ -128,12 +127,12 @@ class iamInlineEdit extends HTMLElement {
|
|
|
128
127
|
});
|
|
129
128
|
}
|
|
130
129
|
if (input.tagName != 'SELECT') {
|
|
131
|
-
input.addEventListener('focus', (
|
|
130
|
+
input.addEventListener('focus', () => {
|
|
132
131
|
input.select();
|
|
133
132
|
});
|
|
134
133
|
}
|
|
135
134
|
//blur it should autosave
|
|
136
|
-
input.addEventListener('blur', (
|
|
135
|
+
input.addEventListener('blur', () => {
|
|
137
136
|
if (input.value != originalValue) {
|
|
138
137
|
if (inlineEdit.hasAttribute('data-autosave')) {
|
|
139
138
|
originalValue = input.value;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.2.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class b extends HTMLElement{constructor(){super();const t=this.attachShadow({mode:"open"}),
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class b extends HTMLElement{constructor(){super();const t=this.attachShadow({mode:"open"}),s=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",l=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${s}/css/core.min.css`,e=document.createElement("template");e.innerHTML=`
|
|
5
5
|
<style class="styles">
|
|
6
|
-
@import "${
|
|
6
|
+
@import "${l}";
|
|
7
7
|
:host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
|
|
8
8
|
|
|
9
9
|
</style>
|
|
@@ -18,5 +18,5 @@
|
|
|
18
18
|
<span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saved"><i class="fa-regular fa-check me-1"></i> Saved</span>
|
|
19
19
|
<span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="notsaved"><i class="fa-regular fa-circle-info me-1"></i> Not Saved</span>
|
|
20
20
|
</div>
|
|
21
|
-
`,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){const t=this,
|
|
21
|
+
`,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){const t=this,s=this.shadowRoot.querySelector("#save"),l=this.shadowRoot.querySelector("#cancel"),e=this.querySelector("input, textarea, select"),i=this.querySelector(".preview"),o=this.shadowRoot.querySelector("#saving"),r=this.shadowRoot.querySelector("#saved"),c=this.shadowRoot.querySelector("#notsaved");let n=e.value;l.addEventListener("click",()=>{e.value=n,e.blur(),t.blur(),t.classList.remove("was-validated"),c.classList.add("d-none");const a=new CustomEvent("inline-edit-cancel",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(a)}),s.addEventListener("click",()=>{if(t.querySelector(":invalid"))return t.classList.add("was-validated"),!1;n=e.value;const a=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),e.disabled=!0,e.blur(),t.blur(),o.classList.remove("d-none"),i&&(console.log(e.value),i.innerHTML=e.value)}),e.tagName==="INPUT"&&e.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),s.click();break}}),t.addEventListener("inline-edit-saved",()=>{setTimeout(()=>{o.classList.add("d-none"),r.classList.remove("d-none");const a=new CustomEvent("inline-edit-confirmed",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(a)},100),setTimeout(()=>{e.disabled=!1,t.removeAttribute("data-saving"),o.classList.add("d-none"),r.classList.add("d-none"),c.classList.add("d-none")},1e3)}),e.tagName==="SELECT"&&e.addEventListener("change",()=>{n=e.value;const a=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),t.setAttribute("data-saving","true"),e.disabled=!0,e.blur()}),e.tagName!="SELECT"&&e.addEventListener("focus",()=>{e.select()}),e.addEventListener("blur",()=>{if(e.value!=n)if(t.hasAttribute("data-autosave")){n=e.value;const a=new CustomEvent("inline-edit-autosave",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),o.classList.remove("d-none"),i&&(i.innerHTML=e.value)}else t.querySelector(".inline-feedback")||c.classList.remove("d-none")}),t.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let d="";Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((v,m)=>{m!=0&&(d+=", "),d+=v.value});const u=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:d}});t.dispatchEvent(u)}})}}export{b as default};
|
|
22
22
|
//# sourceMappingURL=inline-edit.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// @ts-nocheck\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'inline edit',\n});\nclass iamInlineEdit extends HTMLElement {\n constructor() {\n super();\n const shadowRoot = this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/inline-edit.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n \n <slot></slot>\n <div class=\"btns\" part=\"btns\">\n <button class=\"btn btn-action\" id=\"save\" part=\"save-btn\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\" part=\"cancel-btn\">Cancel</button>\n </div>\n <div class=\"status pe-none\" part=\"status\">\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n </div>\n `;\n shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const inlineEdit = this;\n const saveButton = this.shadowRoot.querySelector('#save');\n const cancelButton = this.shadowRoot.querySelector('#cancel');\n const label = this.querySelector('label');\n const input = this.querySelector('input, textarea, select');\n const preview = this.querySelector('.preview');\n const statusSaving = this.shadowRoot.querySelector('#saving');\n const statusSaved = this.shadowRoot.querySelector('#saved');\n const statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n // Save the original value for later\n let originalValue = input.value;\n // cancel\n cancelButton.addEventListener('click', (event) => {\n input.value = originalValue;\n input.blur();\n inlineEdit.blur();\n inlineEdit.classList.remove('was-validated');\n statusNotSaved.classList.add('d-none');\n const cancelEvent = new CustomEvent('inline-edit-cancel', {\n detail: { name: input.getAttribute('name') },\n });\n inlineEdit.dispatchEvent(cancelEvent);\n });\n // Save\n saveButton.addEventListener('click', (event) => {\n if (inlineEdit.querySelector(':invalid')) {\n inlineEdit.classList.add('was-validated');\n return false;\n }\n originalValue = input.value;\n // dispatch save event\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n //inlineEdit.setAttribute('data-saving','true');\n input.disabled = true;\n input.blur();\n inlineEdit.blur();\n statusSaving.classList.remove('d-none');\n if (preview) {\n console.log(input.value);\n preview.innerHTML = input.value;\n }\n });\n // Save\n if (input.tagName === 'INPUT') {\n input.addEventListener('keydown', (event) => {\n switch (event.key // change to event.key to key to use the above variable\n ) {\n case 'Enter':\n event.stopPropagation();\n event.preventDefault();\n saveButton.click();\n break;\n }\n });\n }\n // Saved\n inlineEdit.addEventListener('inline-edit-saved', (event) => {\n setTimeout(() => {\n statusSaving.classList.add('d-none');\n statusSaved.classList.remove('d-none');\n const confirmEvent = new CustomEvent('inline-edit-confirmed', {\n detail: { name: input.getAttribute('name') },\n });\n inlineEdit.dispatchEvent(confirmEvent);\n }, 100);\n // Reset to normal\n setTimeout(() => {\n input.disabled = false;\n inlineEdit.removeAttribute('data-saving');\n statusSaving.classList.add('d-none');\n statusSaved.classList.add('d-none');\n statusNotSaved.classList.add('d-none');\n }, 1000);\n });\n // enter key saves\n if (input.tagName === 'SELECT') {\n input.addEventListener('change', (event) => {\n originalValue = input.value;\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n inlineEdit.setAttribute('data-saving', 'true');\n input.disabled = true;\n input.blur();\n });\n }\n if (input.tagName != 'SELECT') {\n input.addEventListener('focus', (event) => {\n input.select();\n });\n }\n //blur it should autosave\n input.addEventListener('blur', (event) => {\n if (input.value != originalValue) {\n if (inlineEdit.hasAttribute('data-autosave')) {\n originalValue = input.value;\n const saveEvent = new CustomEvent('inline-edit-autosave', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n statusSaving.classList.remove('d-none');\n if (preview) {\n preview.innerHTML = input.value;\n }\n }\n else if (!inlineEdit.querySelector('.inline-feedback')) {\n statusNotSaved.classList.remove('d-none');\n }\n }\n });\n // checkboxes\n inlineEdit.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let saveValue = '';\n Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n if (index != 0)\n saveValue += ', ';\n saveValue += checkbox.value;\n });\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: {\n name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'),\n value: saveValue,\n },\n });\n inlineEdit.dispatchEvent(saveEvent);\n }\n });\n }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","assetLocation","coreCSS","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","event","cancelEvent","saveEvent","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'inline edit',\n});\nclass iamInlineEdit extends HTMLElement {\n constructor() {\n super();\n const shadowRoot = this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/inline-edit.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n @import \"${coreCSS}\";\n ${loadCSS}\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n \n <slot></slot>\n <div class=\"btns\" part=\"btns\">\n <button class=\"btn btn-action\" id=\"save\" part=\"save-btn\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\" part=\"cancel-btn\">Cancel</button>\n </div>\n <div class=\"status pe-none\" part=\"status\">\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n </div>\n `;\n shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const inlineEdit = this;\n const saveButton = this.shadowRoot.querySelector('#save');\n const cancelButton = this.shadowRoot.querySelector('#cancel');\n const input = this.querySelector('input, textarea, select');\n const preview = this.querySelector('.preview');\n const statusSaving = this.shadowRoot.querySelector('#saving');\n const statusSaved = this.shadowRoot.querySelector('#saved');\n const statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n // Save the original value for later\n let originalValue = input.value;\n // cancel\n cancelButton.addEventListener('click', () => {\n input.value = originalValue;\n input.blur();\n inlineEdit.blur();\n inlineEdit.classList.remove('was-validated');\n statusNotSaved.classList.add('d-none');\n const cancelEvent = new CustomEvent('inline-edit-cancel', {\n detail: { name: input.getAttribute('name') },\n });\n inlineEdit.dispatchEvent(cancelEvent);\n });\n // Save\n saveButton.addEventListener('click', () => {\n if (inlineEdit.querySelector(':invalid')) {\n inlineEdit.classList.add('was-validated');\n return false;\n }\n originalValue = input.value;\n // dispatch save event\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n //inlineEdit.setAttribute('data-saving','true');\n input.disabled = true;\n input.blur();\n inlineEdit.blur();\n statusSaving.classList.remove('d-none');\n if (preview) {\n console.log(input.value);\n preview.innerHTML = input.value;\n }\n });\n // Save\n if (input.tagName === 'INPUT') {\n input.addEventListener('keydown', (event) => {\n switch (event.key // change to event.key to key to use the above variable\n ) {\n case 'Enter':\n event.stopPropagation();\n event.preventDefault();\n saveButton.click();\n break;\n }\n });\n }\n // Saved\n inlineEdit.addEventListener('inline-edit-saved', () => {\n setTimeout(() => {\n statusSaving.classList.add('d-none');\n statusSaved.classList.remove('d-none');\n const confirmEvent = new CustomEvent('inline-edit-confirmed', {\n detail: { name: input.getAttribute('name') },\n });\n inlineEdit.dispatchEvent(confirmEvent);\n }, 100);\n // Reset to normal\n setTimeout(() => {\n input.disabled = false;\n inlineEdit.removeAttribute('data-saving');\n statusSaving.classList.add('d-none');\n statusSaved.classList.add('d-none');\n statusNotSaved.classList.add('d-none');\n }, 1000);\n });\n // enter key saves\n if (input.tagName === 'SELECT') {\n input.addEventListener('change', () => {\n originalValue = input.value;\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n inlineEdit.setAttribute('data-saving', 'true');\n input.disabled = true;\n input.blur();\n });\n }\n if (input.tagName != 'SELECT') {\n input.addEventListener('focus', () => {\n input.select();\n });\n }\n //blur it should autosave\n input.addEventListener('blur', () => {\n if (input.value != originalValue) {\n if (inlineEdit.hasAttribute('data-autosave')) {\n originalValue = input.value;\n const saveEvent = new CustomEvent('inline-edit-autosave', {\n detail: { name: input.getAttribute('name'), value: input.value },\n });\n inlineEdit.dispatchEvent(saveEvent);\n statusSaving.classList.remove('d-none');\n if (preview) {\n preview.innerHTML = input.value;\n }\n }\n else if (!inlineEdit.querySelector('.inline-feedback')) {\n statusNotSaved.classList.remove('d-none');\n }\n }\n });\n // checkboxes\n inlineEdit.addEventListener('change', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n let saveValue = '';\n Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n if (index != 0)\n saveValue += ', ';\n saveValue += checkbox.value;\n });\n const saveEvent = new CustomEvent('inline-edit-save', {\n detail: {\n name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'),\n value: saveValue,\n },\n });\n inlineEdit.dispatchEvent(saveEvent);\n }\n });\n }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","assetLocation","coreCSS","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","cancelEvent","saveEvent","event","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.2.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",i=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["//
|
|
1
|
+
{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'Marketing',\n});\nclass iamMarketing extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/marketing.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n \n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n <div class=\"marketing\">\n \n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('invert-colours');\n if (this.hasAttribute('data-img')) {\n this.shadowRoot\n .querySelector('.marketing')\n .insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n }\n }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","assetLocation","coreCSS","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAEhBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUd,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,YAAY,EAC1B,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,CAAC,sBAAsB,CAE1H,CACA"}
|
|
@@ -0,0 +1,200 @@
|
|
|
1
|
+
class iamMenu extends HTMLElement {
|
|
2
|
+
constructor() {
|
|
3
|
+
super();
|
|
4
|
+
this.attachShadow({ mode: 'open' });
|
|
5
|
+
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
6
|
+
? document.body.getAttribute('data-assets-location')
|
|
7
|
+
: '/assets';
|
|
8
|
+
const loadCSS = `@import "${assetLocation}/css/components/menu.component.css";`;
|
|
9
|
+
const template = document.createElement('template');
|
|
10
|
+
template.innerHTML = `
|
|
11
|
+
<style>
|
|
12
|
+
${loadCSS}
|
|
13
|
+
</style>
|
|
14
|
+
<div class="menu--inner" part="inner">
|
|
15
|
+
<slot></slot>
|
|
16
|
+
</div>`;
|
|
17
|
+
this.shadowRoot.appendChild(template.content.cloneNode(true));
|
|
18
|
+
}
|
|
19
|
+
connectedCallback() {
|
|
20
|
+
const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;
|
|
21
|
+
const menuButton = document.querySelector(`[popovertarget="${menuID}"]`);
|
|
22
|
+
const menuInner = this.shadowRoot.querySelector('.menu--inner');
|
|
23
|
+
const topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');
|
|
24
|
+
const menuItems = this.querySelectorAll('a, button');
|
|
25
|
+
const subMenus = this.querySelectorAll('details');
|
|
26
|
+
let subNextIndex;
|
|
27
|
+
let subPrevIndex;
|
|
28
|
+
// Set the needed CSS styles to connect the ID attribute to the anchor name
|
|
29
|
+
if (menuID && menuButton) {
|
|
30
|
+
menuInner === null || menuInner === void 0 ? void 0 : menuInner.setAttribute('role', 'menu');
|
|
31
|
+
this.style['position-anchor'] = `--${menuID}`;
|
|
32
|
+
menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');
|
|
33
|
+
menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;
|
|
34
|
+
menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);
|
|
35
|
+
subMenus.forEach((item, index) => {
|
|
36
|
+
item.setAttribute('role', 'menu');
|
|
37
|
+
});
|
|
38
|
+
menuItems.forEach((item, index) => {
|
|
39
|
+
item.setAttribute('role', 'menuitem');
|
|
40
|
+
item.setAttribute('tabindex', '0');
|
|
41
|
+
if (index == 0) {
|
|
42
|
+
item.setAttribute('autofocus', true);
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
this.addEventListener('keydown', (event) => {
|
|
46
|
+
if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {
|
|
47
|
+
const activeItem = document.activeElement;
|
|
48
|
+
const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;
|
|
49
|
+
const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;
|
|
50
|
+
switch (event.keyCode // change to event.key to key to use the above variable
|
|
51
|
+
) {
|
|
52
|
+
case 27: // Esc
|
|
53
|
+
if (activeItem.closest('details')) {
|
|
54
|
+
event.stopPropagation();
|
|
55
|
+
event.preventDefault();
|
|
56
|
+
activeItem.closest('details').removeAttribute('open');
|
|
57
|
+
activeItem.closest('details').querySelector(':scope summary').focus();
|
|
58
|
+
}
|
|
59
|
+
else {
|
|
60
|
+
event.stopPropagation();
|
|
61
|
+
menuButton.focus();
|
|
62
|
+
}
|
|
63
|
+
break;
|
|
64
|
+
case 32: // Space
|
|
65
|
+
case 13: // Enter
|
|
66
|
+
if (activeItem.matches('summary') && !activeItem.parentElement.matches('details[open]')) {
|
|
67
|
+
activeItem.parentElement.setAttribute('open', true);
|
|
68
|
+
const subMenuItems = activeItem
|
|
69
|
+
.closest('details')
|
|
70
|
+
.querySelectorAll('a, button, :scope details > summary');
|
|
71
|
+
Array.from(subMenuItems)[0].focus();
|
|
72
|
+
}
|
|
73
|
+
break;
|
|
74
|
+
case 35: // end
|
|
75
|
+
event.stopPropagation();
|
|
76
|
+
event.preventDefault();
|
|
77
|
+
this.querySelector('details[open]').removeAttribute('open');
|
|
78
|
+
Array.from(menuItems)[menuItems.length - 1].focus();
|
|
79
|
+
break;
|
|
80
|
+
case 36: // home
|
|
81
|
+
event.stopPropagation();
|
|
82
|
+
event.preventDefault();
|
|
83
|
+
this.querySelector('details[open]').removeAttribute('open');
|
|
84
|
+
Array.from(menuItems)[0].focus();
|
|
85
|
+
break;
|
|
86
|
+
case 38: // up
|
|
87
|
+
event.stopPropagation();
|
|
88
|
+
event.preventDefault();
|
|
89
|
+
if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {
|
|
90
|
+
if (Array.from(topLevelmenuItems)[prevIndex] != undefined)
|
|
91
|
+
Array.from(topLevelmenuItems)[prevIndex].focus();
|
|
92
|
+
else
|
|
93
|
+
Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();
|
|
94
|
+
}
|
|
95
|
+
else if (activeItem.closest('details')) {
|
|
96
|
+
const subMenuItems = activeItem
|
|
97
|
+
.closest('details')
|
|
98
|
+
.querySelectorAll('a, button, :scope details > summary');
|
|
99
|
+
subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;
|
|
100
|
+
if (Array.from(subMenuItems)[subPrevIndex] != undefined)
|
|
101
|
+
Array.from(subMenuItems)[subPrevIndex].focus();
|
|
102
|
+
else
|
|
103
|
+
Array.from(subMenuItems)[subMenuItems.length - 1].focus();
|
|
104
|
+
}
|
|
105
|
+
break;
|
|
106
|
+
case 40: // down
|
|
107
|
+
event.stopPropagation();
|
|
108
|
+
event.preventDefault();
|
|
109
|
+
if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {
|
|
110
|
+
if (Array.from(topLevelmenuItems)[nextIndex] != undefined)
|
|
111
|
+
Array.from(topLevelmenuItems)[nextIndex].focus();
|
|
112
|
+
else
|
|
113
|
+
Array.from(topLevelmenuItems)[0].focus();
|
|
114
|
+
}
|
|
115
|
+
else if (activeItem.closest('details')) {
|
|
116
|
+
const subMenuItems = activeItem
|
|
117
|
+
.closest('details')
|
|
118
|
+
.querySelectorAll('a, button, :scope details > summary');
|
|
119
|
+
subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;
|
|
120
|
+
if (Array.from(subMenuItems)[subNextIndex] != undefined)
|
|
121
|
+
Array.from(subMenuItems)[subNextIndex].focus();
|
|
122
|
+
else
|
|
123
|
+
Array.from(subMenuItems)[0].focus();
|
|
124
|
+
}
|
|
125
|
+
break;
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
});
|
|
129
|
+
}
|
|
130
|
+
// insert extra CSS to help style inline details and summary items to allow collapsible sub menus
|
|
131
|
+
if (this.querySelector('details') && !document.getElementById('menuGlobalStyles'))
|
|
132
|
+
document.head.insertAdjacentHTML('beforeend', `<style id="menuGlobalStyles">
|
|
133
|
+
iam-menu details > * {
|
|
134
|
+
background: unset !important;
|
|
135
|
+
border: unset !important;
|
|
136
|
+
color: inherit!important;
|
|
137
|
+
font-weight: inherit!important;
|
|
138
|
+
font-family: inherit!important;
|
|
139
|
+
font-size: 1rem!important;
|
|
140
|
+
display: block!important;
|
|
141
|
+
margin: var(--menu-item-margin, 0 0 0.25rem 0)!important;
|
|
142
|
+
padding: var(--menu-item-padding, 0)!important;
|
|
143
|
+
width: var(--menu-item-width, 100%)!important;
|
|
144
|
+
text-align: var(--menu-item-text-align, left)!important;
|
|
145
|
+
cursor: var(--menu-item-cursor, pointer)!important;
|
|
146
|
+
}
|
|
147
|
+
iam-menu details > *:after,
|
|
148
|
+
iam-menu details > *:not(summary):before {
|
|
149
|
+
display: none!important;
|
|
150
|
+
}
|
|
151
|
+
iam-menu details :is(button,a) {
|
|
152
|
+
padding-inline-start: var(--menu-dialog-offset,1rem)!important;
|
|
153
|
+
}
|
|
154
|
+
iam-menu details :is(button,a):last-child {
|
|
155
|
+
margin-block-end: var(--menu-dialog-offset,1rem)!important;
|
|
156
|
+
}
|
|
157
|
+
iam-menu details summary {
|
|
158
|
+
padding: 0 !important;
|
|
159
|
+
margin: var(--menu-item-margin, 0 0 0.25rem 0)!important;
|
|
160
|
+
}
|
|
161
|
+
iam-menu details summary:before {
|
|
162
|
+
text-align: center;
|
|
163
|
+
display: inline-block!important;
|
|
164
|
+
vertical-align: bottom;
|
|
165
|
+
float: right;
|
|
166
|
+
color: inherit;
|
|
167
|
+
height: 1em;
|
|
168
|
+
width: 1em;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
iam-menu details summary[class*="fa-"]:before {
|
|
172
|
+
font-family: var(--fa-font-family, "Font Awesome 6 Pro");
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
iam-menu details summary:not([class*="fa-"]:before {
|
|
176
|
+
--icon-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22'%3e%3cpath d='M6.5,2l9,9-9,9' style='fill:none;stroke:%23000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:3px'/%3e%3c/svg%3e");
|
|
177
|
+
|
|
178
|
+
content: ""!important;
|
|
179
|
+
height: 1.2rem;
|
|
180
|
+
width: 1.2rem;
|
|
181
|
+
background: var(--colour-primary-theme);
|
|
182
|
+
mask-image: var(--icon, var(--icon-arrow));
|
|
183
|
+
mask-size: 50%;
|
|
184
|
+
mask-repeat: no-repeat;
|
|
185
|
+
mask-position: 50% 50%;
|
|
186
|
+
-webkit-mask-image: var(--icon, var(--icon-arrow));
|
|
187
|
+
-webkit-mask-size: 50%;
|
|
188
|
+
-webkit-mask-repeat: no-repeat;
|
|
189
|
+
-webkit-mask-position: 50% 50%;
|
|
190
|
+
z-index: 2;
|
|
191
|
+
display: inline-block;
|
|
192
|
+
vertical-align: bottom;
|
|
193
|
+
float: right;
|
|
194
|
+
rotate: 90deg;
|
|
195
|
+
color: inherit;
|
|
196
|
+
}
|
|
197
|
+
</style>`);
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
export default iamMenu;
|