@iamproperty/components 7.4.0 → 7.5.1--beta1
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/README.md +1 -1
- package/assets/css/components/actionbar.component.css +1 -1
- package/assets/css/components/actionbar.component.css.map +1 -1
- 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.component.css +1 -0
- package/assets/css/components/address-lookup.component.css.map +1 -0
- package/assets/css/components/applied-filters.css +1 -1
- package/assets/css/components/applied-filters.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/calendar.component.css +1 -1
- package/assets/css/components/calendar.component.css.map +1 -1
- package/assets/css/components/calendar.config.css.map +1 -1
- 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/charts.css +1 -1
- package/assets/css/components/charts.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/content.component.css +1 -1
- package/assets/css/components/content.component.css.map +1 -1
- package/assets/css/components/darkmode.component.css +1 -0
- package/assets/css/components/darkmode.component.css.map +1 -0
- package/assets/css/components/doughnutchart.component.css +1 -1
- package/assets/css/components/doughnutchart.component.css.map +1 -1
- package/assets/css/components/fileupload.css +1 -1
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/header.css +1 -1
- package/assets/css/components/header.css.map +1 -1
- package/assets/css/components/inline-edit.css +1 -1
- package/assets/css/components/inline-edit.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/{menu.css → menu.global.css} +1 -1
- package/assets/css/components/menu.global.css.map +1 -0
- package/assets/css/components/milestone.css +1 -1
- package/assets/css/components/milestone.css.map +1 -1
- package/assets/css/components/multi-step.component.css +1 -1
- package/assets/css/components/multi-step.component.css.map +1 -1
- package/assets/css/components/multiselect.css +1 -1
- package/assets/css/components/multiselect.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 -1
- package/assets/css/components/nav.component.css.map +1 -1
- package/assets/css/components/nav.global.css +1 -1
- package/assets/css/components/nav.global.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 +1 -1
- package/assets/css/components/property-searchbar.css.map +1 -1
- package/assets/css/components/rank.component.css +1 -1
- package/assets/css/components/rank.component.css.map +1 -1
- package/assets/css/components/rankings.component.css +1 -1
- package/assets/css/components/rankings.component.css.map +1 -1
- package/assets/css/components/rankings.global.css +1 -1
- package/assets/css/components/rankings.global.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/split-button.component.css +1 -1
- package/assets/css/components/split-button.component.css.map +1 -1
- package/assets/css/components/table-basic.global.css +1 -1
- package/assets/css/components/table-basic.global.css.map +1 -1
- 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 -1
- package/assets/css/components/tabs.component.css.map +1 -1
- package/assets/css/components/tabs.config.css +1 -1
- package/assets/css/components/tabs.config.css.map +1 -1
- package/assets/css/components/word-count.component.css +1 -0
- package/assets/css/components/word-count.component.css.map +1 -0
- 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 -1
- package/assets/css/mobile-core.min.css.map +1 -1
- package/assets/css/mobile.min.css +1 -1
- package/assets/css/mobile.min.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.js +39 -25
- package/assets/js/components/accordion/accordion.component.min.js +14 -15
- package/assets/js/components/accordion/accordion.component.min.js.map +1 -1
- package/assets/js/components/actionbar/actionbar.component.js +16 -9
- package/assets/js/components/actionbar/actionbar.component.min.js +13 -5
- package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.js +6 -11
- package/assets/js/components/address-lookup/address-lookup.component.min.js +10 -12
- package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.min.js +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.js +2 -5
- package/assets/js/components/applied-filters/applied-filters.component.min.js +7 -7
- package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -1
- package/assets/js/components/barchart/barchart.component.min.js +2 -2
- package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
- package/assets/js/components/bento-grid/bento-grid.component.min.js +1 -1
- package/assets/js/components/bento-grid/bento-grid.component.min.js.map +1 -1
- package/assets/js/components/calendar/calendar.component.js +153 -136
- package/assets/js/components/calendar/calendar.component.min.js +3 -3
- package/assets/js/components/calendar/calendar.component.min.js.map +1 -1
- package/assets/js/components/card/card.component.js +3 -9
- package/assets/js/components/card/card.component.min.js +13 -7
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/carousel/carousel.component.js +17 -19
- package/assets/js/components/carousel/carousel.component.min.js +17 -19
- package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
- package/assets/js/components/collapsible-side/collapsible-side.component.js +0 -5
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +4 -6
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
- package/assets/js/components/content/content.component.min.js +2 -2
- package/assets/js/components/content/content.component.min.js.map +1 -1
- package/assets/js/components/darkmode/darkmode.component.js +70 -0
- package/assets/js/components/darkmode/darkmode.component.min.js +10 -0
- package/assets/js/components/darkmode/darkmode.component.min.js.map +1 -0
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +2 -2
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js.map +1 -1
- package/assets/js/components/fileupload/fileupload.component.js +1 -5
- package/assets/js/components/fileupload/fileupload.component.min.js +5 -6
- package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
- package/assets/js/components/filter-card/filter-card.component.min.js +1 -1
- package/assets/js/components/filter-card/filter-card.component.min.js.map +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js.map +1 -1
- package/assets/js/components/header/header.component.js +0 -5
- package/assets/js/components/header/header.component.min.js +4 -6
- package/assets/js/components/header/header.component.min.js.map +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.js +61 -60
- package/assets/js/components/inline-edit/inline-edit.component.min.js +5 -5
- package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
- package/assets/js/components/marketing/marketing.component.js +0 -4
- package/assets/js/components/marketing/marketing.component.min.js +3 -4
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
- package/assets/js/components/menu/menu.component.js +2 -2
- package/assets/js/components/menu/menu.component.min.js +4 -5
- package/assets/js/components/menu/menu.component.min.js.map +1 -1
- package/assets/js/components/milestone/milestone.component.js +12 -14
- package/assets/js/components/milestone/milestone.component.min.js +1 -1
- package/assets/js/components/milestone/milestone.component.min.js.map +1 -1
- package/assets/js/components/milestone-group/milestone-group.component.js +10 -12
- package/assets/js/components/milestone-group/milestone-group.component.min.js +1 -1
- package/assets/js/components/milestone-group/milestone-group.component.min.js.map +1 -1
- package/assets/js/components/multi-step/multi-step.component.min.js +3 -3
- package/assets/js/components/multi-step/multi-step.component.min.js.map +1 -1
- package/assets/js/components/multiselect/multiselect.component.js +90 -13
- package/assets/js/components/multiselect/multiselect.component.min.js +5 -5
- package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
- package/assets/js/components/nav/nav.component.js +4 -7
- package/assets/js/components/nav/nav.component.min.js +8 -7
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.js +2 -7
- package/assets/js/components/notification/notification.component.min.js +6 -6
- package/assets/js/components/notification/notification.component.min.js.map +1 -1
- package/assets/js/components/pagination/pagination.component.js +3 -8
- package/assets/js/components/pagination/pagination.component.min.js +7 -8
- package/assets/js/components/pagination/pagination.component.min.js.map +1 -1
- package/assets/js/components/password-indicator/password-indicator.component.js +19 -0
- package/assets/js/components/password-indicator/password-indicator.component.min.js +7 -0
- package/assets/js/components/password-indicator/password-indicator.component.min.js.map +1 -0
- package/assets/js/components/rank/rank.component.js +2 -2
- package/assets/js/components/rank/rank.component.min.js +4 -5
- package/assets/js/components/rank/rank.component.min.js.map +1 -1
- package/assets/js/components/rankings/rankings.component.js +3 -0
- package/assets/js/components/rankings/rankings.component.min.js +364 -5
- package/assets/js/components/rankings/rankings.component.min.js.map +1 -1
- package/assets/js/components/record-card/record-card.component.min.js +1 -1
- package/assets/js/components/record-card/record-card.component.min.js.map +1 -1
- package/assets/js/components/search/search.component.js +0 -4
- package/assets/js/components/search/search.component.min.js +5 -6
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.js +0 -4
- package/assets/js/components/slider/slider.component.min.js +4 -5
- package/assets/js/components/slider/slider.component.min.js.map +1 -1
- package/assets/js/components/split-button/split-button.component.js +1 -3
- package/assets/js/components/split-button/split-button.component.min.js +8 -11
- package/assets/js/components/split-button/split-button.component.min.js.map +1 -1
- package/assets/js/components/table/table.component.min.js +4 -4
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/table-ajax/table-ajax.component.js +11 -9
- package/assets/js/components/table-ajax/table-ajax.component.min.js +4 -4
- package/assets/js/components/table-ajax/table-ajax.component.min.js.map +1 -1
- package/assets/js/components/table-basic/table-basic.component.min.js +4 -4
- package/assets/js/components/table-basic/table-basic.component.min.js.map +1 -1
- package/assets/js/components/table-no-submit/table-no-submit.component.js +15 -30
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js +4 -4
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js.map +1 -1
- package/assets/js/components/table-submit/table-submit.component.min.js +4 -4
- package/assets/js/components/table-submit/table-submit.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.js +1 -4
- package/assets/js/components/tabs/tabs.component.min.js +5 -5
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/video-card/video-card.component.min.js +1 -1
- package/assets/js/components/video-card/video-card.component.min.js.map +1 -1
- package/assets/js/components/word-count/word-count.component.js +81 -0
- package/assets/js/components/word-count/word-count.component.min.js +12 -0
- package/assets/js/components/word-count/word-count.component.min.js.map +1 -0
- package/assets/js/components.js +1 -0
- package/assets/js/modules/advanced-select.js +1 -1
- package/assets/js/modules/dynamicEvents.js +3 -3
- package/assets/js/modules/inputs.js +0 -26
- package/assets/js/modules/milestone.js +2 -2
- package/assets/js/modules/password-indicator.js +21 -0
- package/assets/js/modules/table.js +28 -2
- 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 +3 -1
- package/assets/sass/_components.scss +6 -5
- package/assets/sass/_elements.scss +5 -0
- package/assets/sass/_example.scss +1 -1
- package/assets/sass/_functions/utility-mixins.scss +21 -1
- package/assets/sass/_functions/variables.scss +14 -0
- package/assets/sass/components/actionbar.component.scss +38 -1
- package/assets/sass/components/actionbar.global.scss +1 -1
- package/assets/sass/components/{address-lookup.scss → address-lookup.component.scss} +10 -0
- package/assets/sass/components/applied-filters.scss +1 -0
- package/assets/sass/components/calendar.component.scss +163 -271
- package/assets/sass/components/calendar.config.scss +69 -122
- package/assets/sass/components/collapsible-side.scss +2 -0
- package/assets/sass/components/darkmode.component.scss +22 -0
- package/assets/sass/components/fileupload.scss +18 -0
- package/assets/sass/components/header.scss +9 -0
- package/assets/sass/components/inline-edit.preload.scss +68 -2
- package/assets/sass/components/inline-edit.scss +7 -0
- package/assets/sass/components/milestone.scss +69 -60
- package/assets/sass/components/multi-step.component.scss +1 -1
- package/assets/sass/components/multiselect.preload.scss +11 -1
- package/assets/sass/components/multiselect.scss +62 -5
- package/assets/sass/components/nav.component.scss +31 -6
- package/assets/sass/components/nav.global.scss +8 -12
- package/assets/sass/components/notification.scss +38 -17
- package/assets/sass/components/pagination.scss +6 -0
- package/assets/sass/components/slider.scss +1 -0
- package/assets/sass/components/split-button.component.scss +3 -1
- package/assets/sass/components/table-basic.global.scss +33 -33
- package/assets/sass/components/table.global.scss +9 -4
- package/assets/sass/components/tabs.component.scss +4 -0
- package/assets/sass/components/tabs.config.scss +231 -4
- package/assets/sass/components/word-count.component.scss +26 -0
- package/assets/sass/elements/admin-panel.scss +38 -10
- package/assets/sass/elements/buttons--compact.scss +1 -1
- package/assets/sass/elements/buttons--global.scss +3 -3
- package/assets/sass/elements/details.scss +33 -6
- package/assets/sass/elements/forms.scss +23 -31
- package/assets/sass/elements/hr.scss +50 -0
- package/assets/sass/elements/icons.scss +5 -0
- package/assets/sass/elements/links.scss +2 -2
- package/assets/sass/elements/lists.scss +1 -1
- package/assets/sass/elements/modal.scss +1 -5
- package/assets/sass/elements/toggle-button.scss +1 -0
- package/assets/sass/elements/type.scss +6 -9
- package/assets/sass/foundations/colours.scss +0 -0
- package/assets/sass/foundations/reboot.scss +14 -18
- package/assets/sass/foundations/root.scss +43 -51
- package/assets/sass/templates/form.scss +5 -0
- package/assets/ts/components/accordion/accordion.component.ts +46 -33
- package/assets/ts/components/actionbar/actionbar.component.ts +29 -10
- package/assets/ts/components/address-lookup/address-lookup.component.ts +7 -11
- package/assets/ts/components/applied-filters/applied-filters.component.ts +2 -5
- package/assets/ts/components/calendar/calendar.component.ts +368 -498
- package/assets/ts/components/card/card.component.ts +2 -9
- package/assets/ts/components/carousel/carousel.component.ts +17 -19
- package/assets/ts/components/collapsible-side/collapsible-side.component.ts +1 -5
- package/assets/ts/components/darkmode/darkmode.component.ts +85 -0
- package/assets/ts/components/fileupload/fileupload.component.ts +2 -5
- package/assets/ts/components/header/header.component.ts +1 -5
- package/assets/ts/components/inline-edit/inline-edit.component.ts +74 -75
- package/assets/ts/components/marketing/marketing.component.ts +0 -4
- package/assets/ts/components/menu/menu.component.ts +2 -2
- package/assets/ts/components/milestone/milestone.component.ts +43 -45
- package/assets/ts/components/milestone-group/milestone-group.component.ts +39 -41
- package/assets/ts/components/multiselect/multiselect.component.ts +103 -27
- package/assets/ts/components/nav/nav.component.ts +10 -19
- package/assets/ts/components/notification/notification.component.ts +3 -9
- package/assets/ts/components/pagination/pagination.component.ts +6 -8
- package/assets/ts/components/password-indicator/password-indicator.component.ts +24 -0
- package/assets/ts/components/rank/rank.component.ts +2 -2
- package/assets/ts/components/rankings/rankings.component.ts +4 -0
- package/assets/ts/components/search/search.component.ts +0 -4
- package/assets/ts/components/slider/slider.component.ts +1 -4
- package/assets/ts/components/split-button/split-button.component.ts +1 -3
- package/assets/ts/components/table-ajax/table-ajax.component.ts +5 -5
- package/assets/ts/components/table-no-submit/table-no-submit.component.ts +10 -21
- package/assets/ts/components/tabs/tabs.component.ts +2 -4
- package/assets/ts/components/word-count/word-count.component.ts +91 -0
- package/assets/ts/components.ts +1 -0
- package/assets/ts/modules/advanced-select.ts +11 -16
- package/assets/ts/modules/data-layer.md +0 -5
- package/assets/ts/modules/dynamicEvents.ts +6 -7
- package/assets/ts/modules/inputs.ts +0 -31
- package/assets/ts/modules/milestone-group.ts +39 -42
- package/assets/ts/modules/milestone.ts +119 -122
- package/assets/ts/modules/password-indicator.ts +29 -0
- package/assets/ts/modules/table.ts +41 -3
- package/assets/ts/scripts.ts +4 -1
- package/dist/components.es.js +1691 -41
- package/dist/components.umd.js +1398 -231
- package/package.json +6 -6
- package/src/components/Accordion/Accordion.vue +14 -23
- package/src/components/Accordion/AccordionItem.vue +27 -43
- package/src/components/Actionbar/Actionbar.vue +17 -19
- package/src/components/AddressLookup/AddressLookup.vue +17 -18
- package/src/components/AdvancedSelect/AdvancedSelect.vue +17 -18
- package/src/components/AppliedFilters/AppliedFilters.vue +16 -18
- package/src/components/Banner/Banner.vue +18 -21
- package/src/components/BarChart/BarChart.vue +17 -18
- package/src/components/Calendar/Calendar.vue +14 -20
- package/src/components/Card/Card.vue +17 -17
- package/src/components/Carousel/Carousel.vue +17 -20
- package/src/components/Content/Content.vue +17 -18
- package/src/components/DarkMode/DarkMode.vue +19 -0
- package/src/components/DoughnutChart/DoughnutChart.vue +17 -18
- package/src/components/FileUpload/FileUpload.vue +22 -28
- package/src/components/FilterCard/FilterCard.vue +17 -18
- package/src/components/Filterlist/Filterlist.vue +17 -0
- package/src/components/Header/Header.vue +28 -29
- package/src/components/InlineEdit/InlineEdit.vue +11 -19
- package/src/components/Menu/Menu.vue +17 -17
- package/src/components/Milestones/Milestone.vue +22 -27
- package/src/components/Milestones/MilestoneGroup.vue +24 -27
- package/src/components/Multiselect/Multiselect.vue +17 -18
- package/src/components/Nav/Nav.vue +17 -19
- package/src/components/Notification/Notification.vue +17 -15
- package/src/components/Pagination/Pagination.vue +16 -16
- package/src/components/PasswordIndicator/PasswordIndicator.vue +23 -0
- package/src/components/Rank/Rank.vue +17 -18
- package/src/components/Rankings/Rankings.vue +17 -27
- package/src/components/RecordCard/RecordCard.vue +17 -18
- package/src/components/Search/Search.vue +17 -17
- package/src/components/Slider/Slider.vue +17 -17
- package/src/components/SplitButton/SplitButton.vue +17 -20
- package/src/components/Tabs/Tabs.vue +17 -17
- package/src/components/VideoCard/VideoCard.vue +17 -18
- package/src/components/WordCount/WordCount.vue +22 -0
- package/src/index.js +43 -44
- package/assets/css/components/address-lookup.css +0 -1
- package/assets/css/components/address-lookup.css.map +0 -1
- package/assets/css/components/menu.css.map +0 -1
- package/assets/css/components/tabs.css +0 -1
- package/assets/css/components/tabs.css.map +0 -1
- package/assets/sass/components/tabs.scss +0 -254
- package/assets/ts/components/accordion/README.md +0 -31
- package/assets/ts/components/fileupload/README.md +0 -28
- /package/assets/sass/components/{menu.scss → menu.global.scss} +0 -0
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class v extends HTMLElement{constructor(){super();const e=this.attachShadow({mode:"open"});document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
|
|
5
5
|
<style class="styles">
|
|
6
|
-
|
|
7
|
-
.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}@media screen and (min-width: 36em){.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}}@media screen and (min-width: 62em){.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}}: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 */
|
|
6
|
+
|
|
7
|
+
@layer elements{.btn-action{--btn-border-width: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action{border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}@media screen and (min-width: 36em){.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}}@media screen and (min-width: 62em){.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}}*,*::before,*::after{box-sizing:border-box}: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>
|
|
10
10
|
<link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
|
|
@@ -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
|
-
`,
|
|
21
|
+
`,e.appendChild(n.content.cloneNode(!0))}connectedCallback(){const e=this,n=this.shadowRoot.querySelector("#save"),c=this.shadowRoot.querySelector("#cancel"),t=this.querySelector("input, textarea, select"),s=this.querySelector(".preview"),o=this.shadowRoot.querySelector("#saving"),d=this.shadowRoot.querySelector("#saved"),l=this.shadowRoot.querySelector("#notsaved");let i=t?t.value:"";c.addEventListener("click",()=>{t&&(t.value=i,t.blur()),e.blur(),e.classList.remove("was-validated"),l.classList.add("d-none");const a=new CustomEvent("inline-edit-cancel",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)}),n.addEventListener("click",()=>{if(e.querySelector(":invalid"))return e.classList.add("was-validated"),!1;i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.blur(),o.classList.remove("d-none"),t&&(t.disabled=!0,t.blur(),s&&(s.innerHTML=t.value))}),t&&(t.tagName==="INPUT"&&t.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),n.click();break}}),t.tagName==="SELECT"&&t.addEventListener("change",()=>{i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.setAttribute("data-saving","true"),t.disabled=!0,t.blur()}),t.tagName!="SELECT"&&t.addEventListener("focus",()=>{t.select()}),t.addEventListener("blur",()=>{if(t.value!=i)if(e.hasAttribute("data-autosave")){i=t.value;const a=new CustomEvent("inline-edit-autosave",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),o.classList.remove("d-none"),s&&(s.innerHTML=t.value)}else e.querySelector(".inline-feedback")||l.classList.remove("d-none")})),e.addEventListener("inline-edit-saved",()=>{setTimeout(()=>{o.classList.add("d-none"),d.classList.remove("d-none");const a=new CustomEvent("inline-edit-confirmed",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)},100),setTimeout(()=>{t.disabled=!1,e.removeAttribute("data-saving"),o.classList.add("d-none"),d.classList.add("d-none"),l.classList.add("d-none")},1e3)}),e.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let r="";Array.from(e.querySelectorAll('label input[type="checkbox"]:checked')).forEach((p,m)=>{m!=0&&(r+=", "),r+=p.value});const b=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:r}});e.dispatchEvent(b)}})}}export{v 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":["// 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
|
+
{"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 loadCSS = `@import \"${assetLocation}/css/components/inline-edit.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style class=\"styles\">\n \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 ? input.value : '';\n // cancel\n cancelButton.addEventListener('click', () => {\n if (input) {\n input.value = originalValue;\n input.blur();\n }\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.blur();\n statusSaving.classList.remove('d-none');\n if (input) {\n input.disabled = true;\n input.blur();\n if (preview) {\n preview.innerHTML = input.value;\n }\n }\n });\n if (input) {\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 // 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 }\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 // 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","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","cancelEvent","saveEvent","event","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
|
|
@@ -11,14 +11,10 @@ class iamMarketing extends HTMLElement {
|
|
|
11
11
|
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
12
12
|
? document.body.getAttribute('data-assets-location')
|
|
13
13
|
: '/assets';
|
|
14
|
-
const coreCSS = document.body.hasAttribute('data-core-css')
|
|
15
|
-
? document.body.getAttribute('data-core-css')
|
|
16
|
-
: `${assetLocation}/css/core.min.css`;
|
|
17
14
|
const loadCSS = `@import "${assetLocation}/css/components/marketing.component.css";`;
|
|
18
15
|
const template = document.createElement('template');
|
|
19
16
|
template.innerHTML = `
|
|
20
17
|
<style>
|
|
21
|
-
@import "${coreCSS}";
|
|
22
18
|
${loadCSS}
|
|
23
19
|
|
|
24
20
|
</style>
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class e extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
@import "${i}";
|
|
7
6
|
:host{display:flex;position:relative;overflow:hidden;position:relative;overflow:hidden;margin-bottom:2rem;min-width:100%;padding:2rem;border-radius:.5rem;text-align:center;align-items:flex-end;padding-top:33%}figure{position:absolute;height:100%;width:100%;top:0;left:0;margin:0}figure:after{content:"";inset:0;height:100%;width:100%;position:absolute;background-image:linear-gradient(15deg, #00313c 0%, #03404f 28.7%, #03404f 31.5%, #044353 60.1%, #1bb1dc 83.2%, rgba(28, 182, 226, 0.486) 100%);opacity:.85;z-index:1}img{pointer-events:none;position:absolute;inset:0;width:100%;max-height:auto;z-index:2;-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));mask-image:linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));mix-blend-mode:multiply}::slotted(*){position:relative;z-index:2;text-align:center}/*# sourceMappingURL=assets/css/components/marketing.component.css.map */
|
|
8
7
|
|
|
9
8
|
|
|
@@ -13,5 +12,5 @@
|
|
|
13
12
|
|
|
14
13
|
<slot></slot>
|
|
15
14
|
</div>
|
|
16
|
-
`,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("invert-colours"),this.hasAttribute("data-img")&&this.shadowRoot.querySelector(".marketing").insertAdjacentHTML("afterbegin",`<figure><img src="${this.getAttribute("data-img")}" alt="" /></figure>`)}}export{
|
|
15
|
+
`,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("invert-colours"),this.hasAttribute("data-img")&&this.shadowRoot.querySelector(".marketing").insertAdjacentHTML("afterbegin",`<figure><img src="${this.getAttribute("data-img")}" alt="" /></figure>`)}}export{e as default};
|
|
17
16
|
//# sourceMappingURL=marketing.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
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
|
|
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 loadCSS = `@import \"${assetLocation}/css/components/marketing.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\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","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAWrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,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,CAEtH,CACJ"}
|
|
@@ -5,11 +5,11 @@ class iamMenu extends HTMLElement {
|
|
|
5
5
|
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
6
6
|
? document.body.getAttribute('data-assets-location')
|
|
7
7
|
: '/assets';
|
|
8
|
-
const
|
|
8
|
+
const menuCSS = `@import "${assetLocation}/css/components/menu.component.css";`;
|
|
9
9
|
const template = document.createElement('template');
|
|
10
10
|
template.innerHTML = `
|
|
11
11
|
<style>
|
|
12
|
-
${
|
|
12
|
+
${menuCSS}
|
|
13
13
|
</style>
|
|
14
14
|
<div class="menu--inner" part="inner">
|
|
15
15
|
<slot></slot>
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/class
|
|
4
|
+
*/class m extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const r=`@import "${document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets"}/css/components/menu.component.css";`,s=document.createElement("template");s.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
${r}
|
|
8
7
|
</style>
|
|
9
8
|
<div class="menu--inner" part="inner">
|
|
10
9
|
<slot></slot>
|
|
11
|
-
</div>`,this.shadowRoot.appendChild(
|
|
10
|
+
</div>`,this.shadowRoot.appendChild(s.content.cloneNode(!0))}connectedCallback(){const n=this.hasAttribute("id")?this.getAttribute("id"):!1,r=document.querySelector(`[popovertarget="${n}"]`);let s=this.querySelectorAll(":scope > a, :scope > button, :scope > details > summary"),l=this.querySelectorAll("a, button");this.closest(".menu__wrapper")&&(l=this.shadowRoot.querySelector("slot").assignedElements({flatten:!0}),s=l),this.querySelectorAll("details");let c,u;n&&r&&(this.setAttribute("role","menu"),this.style["position-anchor"]=`--${n}`,r?.setAttribute("aria-haspopup","true"),r==null||(r.style["anchor-name"]=`--${n}`),r?.setAttribute("aria-controls",n)),l.forEach((t,e)=>{t.setAttribute("role","menuitem"),t.setAttribute("tabindex","0"),e==0&&t.setAttribute("autofocus",!0)}),this.addEventListener("keydown",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("a, button, summary")){const e=document.activeElement,i=Array.from(s).indexOf(e)-1,a=Array.from(s).indexOf(e)+1;switch(t.keyCode){case 27:e.closest("details")?(t.stopPropagation(),t.preventDefault(),e.closest("details").removeAttribute("open"),e.closest("details").querySelector(":scope summary").focus()):(t.stopPropagation(),r.focus());break;case 32:case 13:break;case 35:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[l.length-1].focus();break;case 36:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[0].focus();break;case 38:if(t.stopPropagation(),t.preventDefault(),Array.from(s).indexOf(e)>-1)Array.from(s)[i]!=null?Array.from(s)[i].focus():Array.from(s)[s.length-1].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");u=Array.from(o).indexOf(e)-1,Array.from(o)[u]!=null?Array.from(o)[u].focus():Array.from(o)[o.length-1].focus()}break;case 40:if(t.stopPropagation(),t.preventDefault(),Array.from(s).indexOf(e)>-1)Array.from(s)[a]!=null?Array.from(s)[a].focus():Array.from(s)[0].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");c=Array.from(o).indexOf(e)+1,Array.from(o)[c]!=null?Array.from(o)[c].focus():Array.from(o)[0].focus()}break}}}),this.addEventListener("toggle",t=>{var e,i,a,o;const d=new CustomEvent(t.newState,{detail:{id:this.getAttribute("id"),target:t.target}});this.dispatchEvent(d),this.closest(".menu__wrapper")&&l[0].focus(),this.hasAttribute("popover-open")&&(t.preventDefault(),this.removeAttribute("popover-open"),this.hidePopover()),this.matches(":popover-open")&&document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`)?((e=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||e===void 0||e.setAttribute("aria-pressed","true"),(i=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||i===void 0||i.classList.add("active")):((a=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||a===void 0||a.removeAttribute("aria-pressed"),(o=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||o===void 0||o.classList.remove("active"))}),this.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button:has(+ iam-menu:not([popover]))")){const e=t.target.closest("button:has(+ iam-menu)");e?.classList.toggle("open")}else if(t&&t.target instanceof HTMLElement&&t.target.closest("button.selectable")){const e=t.target.closest("button.selectable");this.hasAttribute("multiple")?e.classList.toggle("selected"):e?.classList.contains("selected")?this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}):(this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}),e.classList.add("selected"))}}),CSS.supports("top","anchor(top)")||document.addEventListener("click",t=>{if(t.originalTarget&&t.originalTarget.matches("[popovertarget]")){const e=t.originalTarget,i=e.getAttribute("popovertarget"),a=document.getElementById(i),o=e.getBoundingClientRect(),d=o.top,p=o.left;a.style.setProperty("top",d+"px"),a.style.setProperty("left",p+e.clientWidth+"px")}})}}export{m as default};
|
|
12
11
|
//# sourceMappingURL=menu.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu 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/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n let menuItems = this.querySelectorAll('a, button');\n if (this.closest('.menu__wrapper')) {\n menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n topLevelmenuItems = menuItems;\n }\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n // Fix the focus\n if (this.closest('.menu__wrapper')) {\n menuItems[0].focus();\n }\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n"],"names":["iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu 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 menuCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${menuCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n let menuItems = this.querySelectorAll('a, button');\n if (this.closest('.menu__wrapper')) {\n menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n topLevelmenuItems = menuItems;\n }\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n // Fix the focus\n if (this.closest('.menu__wrapper')) {\n menuItems[0].focus();\n }\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n"],"names":["iamMenu","menuCSS","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","e","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":"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"}
|
|
@@ -13,25 +13,23 @@ class iamMilestone extends HTMLElement {
|
|
|
13
13
|
? document.body.getAttribute('data-core-css')
|
|
14
14
|
: `${assetLocation}/css/core.min.css`;
|
|
15
15
|
const template = document.createElement('template');
|
|
16
|
-
template.innerHTML = `
|
|
17
|
-
<style>
|
|
18
|
-
@import "${coreCSS}";
|
|
19
|
-
</style>
|
|
20
|
-
<div class="milestone-wrap" part="milestone-wrap">
|
|
21
|
-
<slot name="milestone-intro" class="milestone-intro" part="milestone-intro"></slot>
|
|
22
|
-
<slot>
|
|
23
|
-
<div class="task-wrap" part="milestone-task-wrap"></div>
|
|
24
|
-
</slot>
|
|
25
|
-
</div>
|
|
16
|
+
template.innerHTML = `
|
|
17
|
+
<style>
|
|
18
|
+
@import "${coreCSS}";
|
|
19
|
+
</style>
|
|
20
|
+
<div class="milestone-wrap" part="milestone-wrap">
|
|
21
|
+
<slot name="milestone-intro" class="milestone-intro" part="milestone-intro"></slot>
|
|
22
|
+
<slot>
|
|
23
|
+
<div class="task-wrap" part="milestone-task-wrap"></div>
|
|
24
|
+
</slot>
|
|
25
|
+
</div>
|
|
26
26
|
`;
|
|
27
27
|
(_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
|
|
28
28
|
}
|
|
29
29
|
connectedCallback() {
|
|
30
|
+
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
30
31
|
const milestoneComponent = this;
|
|
31
|
-
trackComponent(milestoneComponent, 'iam-milestone', [
|
|
32
|
-
'milestone-item-closed',
|
|
33
|
-
'milestone-item-opened',
|
|
34
|
-
]);
|
|
32
|
+
trackComponent(milestoneComponent, 'iam-milestone', ['milestone-item-closed', 'milestone-item-opened']);
|
|
35
33
|
milestone(this);
|
|
36
34
|
}
|
|
37
35
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/const l=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},m=(t,n,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:n}),a.forEach(e=>{t.addEventListener(e,function(s){const d={event:e,element:n,target:s.target};Object.keys(s.detail).forEach(o=>{const i=s.detail[o];d[o]=i}),window.dataLayer.push(d)})}),!0),p=function(t){const n=t.dataset.status;if(!n)return;const a=t.shadowRoot.querySelector(".milestone-wrap"),e=document.createElement("span");e.setAttribute("part","status"),e.classList.add("milestone-status"),e.innerHTML=`${n} Step`,n==="Current"&&t.classList.add("current"),a.insertAdjacentElement("afterbegin",e)},u=function(t){const n=t.shadowRoot.querySelector(".task-wrap"),a=t.dataset.items?JSON.parse(t.dataset.items):[];a.length&&(a.forEach(e=>{const s=document.createElement("details"),d=document.createElement("summary"),o=document.createElement("div"),i=document.createElement("p");o.classList.add("task-details"),d.innerHTML=e.name,e.date_completed&&d.classList.add("complete"),s.appendChild(d),e.description&&(i.innerHTML=e.description,o.appendChild(i)),e.actions.length&&o.appendChild(h(e.actions,d)),s.appendChild(o),n.insertAdjacentElement("beforeend",s),s.addEventListener("click",()=>{s?.hasAttribute("open")?r("milestone-item-closed",e.name,t):r("milestone-item-opened",e.name,t)})}),t.appendChild(n))},r=function(t,n,a){const e=new CustomEvent(t,{detail:{title:n}});a.dispatchEvent(e)},h=function(t,n){const a=document.createElement("ul"),e=t.length,d=t.filter(o=>o.date_completed).length||0;if(!(e<1))return n.innerHTML+=` (${d}/${e})`,t.forEach(o=>{const i=document.createElement("li"),c=document.createElement("span");o.date_completed&&(i.classList.add("complete"),c.classList.add("action-date"),c.innerHTML=o.date_completed),i.innerHTML=o.action,i.appendChild(c),a.appendChild(i)}),a},w=function(t){p(t),u(t)};l("iam-milestone");class L extends HTMLElement{constructor(){var n;super(),this.attachShadow({mode:"open"});const a=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"):`${a}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"milestone.component.min.js","sources":["../_global.js","../../modules/milestone.js","milestone.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 setStatus = function (milestoneElement) {\n const status = milestoneElement.dataset.status;\n if (!status) {\n return;\n }\n const milestoneWrap = milestoneElement.shadowRoot.querySelector('.milestone-wrap');\n const statusTag = document.createElement('span');\n statusTag.setAttribute('part', 'status');\n statusTag.classList.add('milestone-status');\n statusTag.innerHTML = `${status} Step`;\n if (status === 'Current') {\n milestoneElement.classList.add('current');\n }\n milestoneWrap.insertAdjacentElement('afterbegin', statusTag);\n};\nexport const getMilestoneTasks = function (milestoneElement) {\n const taskWrap = milestoneElement.shadowRoot.querySelector('.task-wrap');\n const tasks = milestoneElement.dataset.items ? JSON.parse(milestoneElement.dataset.items) : [];\n if (!tasks.length) {\n return;\n }\n tasks.forEach(task => {\n const taskItem = document.createElement('details');\n const taskName = document.createElement('summary');\n const detailsWrap = document.createElement('div');\n const taskDescription = document.createElement('p');\n detailsWrap.classList.add('task-details');\n taskName.innerHTML = task.name;\n if (task.date_completed) {\n taskName.classList.add('complete');\n }\n taskItem.appendChild(taskName);\n if (task.description) {\n taskDescription.innerHTML = task.description;\n detailsWrap.appendChild(taskDescription);\n }\n if (task.actions.length) {\n detailsWrap.appendChild(getSubtasks(task.actions, taskName));\n }\n taskItem.appendChild(detailsWrap);\n taskWrap.insertAdjacentElement('beforeend', taskItem);\n // Fire tracking events\n taskItem.addEventListener('click', () => {\n if (taskItem === null || taskItem === void 0 ? void 0 : taskItem.hasAttribute('open')) {\n itemInteractionEvent('milestone-item-closed', task.name, milestoneElement);\n }\n else {\n itemInteractionEvent('milestone-item-opened', task.name, milestoneElement);\n }\n });\n });\n milestoneElement.appendChild(taskWrap);\n};\nconst itemInteractionEvent = function (eventName, taskName, element) {\n const customEvent = new CustomEvent(eventName, {\n detail: {\n title: taskName,\n },\n });\n element.dispatchEvent(customEvent);\n};\nconst getSubtasks = function (actions, taskName) {\n const actionsWrap = document.createElement('ul');\n const totalCount = actions.length;\n const completed = actions.filter((action) => action.date_completed);\n const completedCount = completed.length || 0;\n if (totalCount < 1) {\n return;\n }\n taskName.innerHTML += ` (${completedCount}/${totalCount})`;\n actions.forEach(action => {\n const actionItem = document.createElement('li');\n const actionCompletedDate = document.createElement('span');\n if (action.date_completed) {\n actionItem.classList.add('complete');\n actionCompletedDate.classList.add('action-date');\n actionCompletedDate.innerHTML = action.date_completed;\n }\n actionItem.innerHTML = action.action;\n actionItem.appendChild(actionCompletedDate);\n actionsWrap.appendChild(actionItem);\n });\n return actionsWrap;\n};\nconst milestone = function (milestoneElement) {\n setStatus(milestoneElement);\n getMilestoneTasks(milestoneElement);\n};\nexport default milestone;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestone from '../../modules/milestone.js';\ntrackComponentRegistered('iam-milestone');\nclass iamMilestone extends HTMLElement {\n constructor() {\n var _a;\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 = `\
|
|
1
|
+
{"version":3,"file":"milestone.component.min.js","sources":["../_global.js","../../modules/milestone.js","milestone.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 setStatus = function (milestoneElement) {\n const status = milestoneElement.dataset.status;\n if (!status) {\n return;\n }\n const milestoneWrap = milestoneElement.shadowRoot.querySelector('.milestone-wrap');\n const statusTag = document.createElement('span');\n statusTag.setAttribute('part', 'status');\n statusTag.classList.add('milestone-status');\n statusTag.innerHTML = `${status} Step`;\n if (status === 'Current') {\n milestoneElement.classList.add('current');\n }\n milestoneWrap.insertAdjacentElement('afterbegin', statusTag);\n};\nexport const getMilestoneTasks = function (milestoneElement) {\n const taskWrap = milestoneElement.shadowRoot.querySelector('.task-wrap');\n const tasks = milestoneElement.dataset.items ? JSON.parse(milestoneElement.dataset.items) : [];\n if (!tasks.length) {\n return;\n }\n tasks.forEach((task) => {\n const taskItem = document.createElement('details');\n const taskName = document.createElement('summary');\n const detailsWrap = document.createElement('div');\n const taskDescription = document.createElement('p');\n detailsWrap.classList.add('task-details');\n taskName.innerHTML = task.name;\n if (task.date_completed) {\n taskName.classList.add('complete');\n }\n taskItem.appendChild(taskName);\n if (task.description) {\n taskDescription.innerHTML = task.description;\n detailsWrap.appendChild(taskDescription);\n }\n if (task.actions.length) {\n detailsWrap.appendChild(getSubtasks(task.actions, taskName));\n }\n taskItem.appendChild(detailsWrap);\n taskWrap.insertAdjacentElement('beforeend', taskItem);\n // Fire tracking events\n taskItem.addEventListener('click', () => {\n if (taskItem === null || taskItem === void 0 ? void 0 : taskItem.hasAttribute('open')) {\n itemInteractionEvent('milestone-item-closed', task.name, milestoneElement);\n }\n else {\n itemInteractionEvent('milestone-item-opened', task.name, milestoneElement);\n }\n });\n });\n milestoneElement.appendChild(taskWrap);\n};\nconst itemInteractionEvent = function (eventName, taskName, element) {\n const customEvent = new CustomEvent(eventName, {\n detail: {\n title: taskName,\n },\n });\n element.dispatchEvent(customEvent);\n};\nconst getSubtasks = function (actions, taskName) {\n const actionsWrap = document.createElement('ul');\n const totalCount = actions.length;\n const completed = actions.filter((action) => action.date_completed);\n const completedCount = completed.length || 0;\n if (totalCount < 1) {\n return;\n }\n taskName.innerHTML += ` (${completedCount}/${totalCount})`;\n actions.forEach((action) => {\n const actionItem = document.createElement('li');\n const actionCompletedDate = document.createElement('span');\n if (action.date_completed) {\n actionItem.classList.add('complete');\n actionCompletedDate.classList.add('action-date');\n actionCompletedDate.innerHTML = action.date_completed;\n }\n actionItem.innerHTML = action.action;\n actionItem.appendChild(actionCompletedDate);\n actionsWrap.appendChild(actionItem);\n });\n return actionsWrap;\n};\nconst milestone = function (milestoneElement) {\n setStatus(milestoneElement);\n getMilestoneTasks(milestoneElement);\n};\nexport default milestone;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestone from '../../modules/milestone.js';\ntrackComponentRegistered('iam-milestone');\nclass iamMilestone extends HTMLElement {\n constructor() {\n var _a;\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 </style>\n <div class=\"milestone-wrap\" part=\"milestone-wrap\">\n <slot name=\"milestone-intro\" class=\"milestone-intro\" part=\"milestone-intro\"></slot>\n <slot>\n <div class=\"task-wrap\" part=\"milestone-task-wrap\"></div>\n </slot>\n </div>\n `;\n (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const milestoneComponent = this;\n trackComponent(milestoneComponent, 'iam-milestone', ['milestone-item-closed', 'milestone-item-opened']);\n milestone(this);\n }\n}\nexport default iamMilestone;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","setStatus","milestoneElement","status","milestoneWrap","statusTag","getMilestoneTasks","taskWrap","tasks","task","taskItem","taskName","detailsWrap","taskDescription","getSubtasks","itemInteractionEvent","element","customEvent","actions","actionsWrap","totalCount","completedCount","action","actionItem","actionCompletedDate","milestone","iamMilestone","_a","assetLocation","coreCSS","template"],"mappings":"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"}
|
|
@@ -12,23 +12,21 @@ class iamMilestoneGroup extends HTMLElement {
|
|
|
12
12
|
? document.body.getAttribute('data-core-css')
|
|
13
13
|
: `${assetLocation}/css/core.min.css`;
|
|
14
14
|
const template = document.createElement('template');
|
|
15
|
-
template.innerHTML = `
|
|
16
|
-
<style>
|
|
17
|
-
@import "${coreCSS}";
|
|
18
|
-
</style>
|
|
19
|
-
<div class="milestone-group" part="milestone-group">
|
|
20
|
-
<slot>
|
|
21
|
-
</slot>
|
|
22
|
-
</div>
|
|
15
|
+
template.innerHTML = `
|
|
16
|
+
<style>
|
|
17
|
+
@import "${coreCSS}";
|
|
18
|
+
</style>
|
|
19
|
+
<div class="milestone-group" part="milestone-group">
|
|
20
|
+
<slot>
|
|
21
|
+
</slot>
|
|
22
|
+
</div>
|
|
23
23
|
`;
|
|
24
24
|
(_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
|
|
25
25
|
}
|
|
26
26
|
connectedCallback() {
|
|
27
|
+
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
27
28
|
const milestoneGroupComponent = this;
|
|
28
|
-
trackComponent(milestoneGroupComponent, 'iam-milestone-group', [
|
|
29
|
-
'hide-future-items',
|
|
30
|
-
'show-future-items'
|
|
31
|
-
]);
|
|
29
|
+
trackComponent(milestoneGroupComponent, 'iam-milestone-group', ['hide-future-items', 'show-future-items']);
|
|
32
30
|
milestoneGroup(this);
|
|
33
31
|
}
|
|
34
32
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/const r=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},l=(t,s,e)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:s}),e.forEach(n=>{t.addEventListener(n,function(o){const a={event:n,element:s,target:o.target};Object.keys(o.detail).forEach(i=>{const d=o.detail[i];a[i]=d}),window.dataLayer.push(a)})}),!0),u=function(t){if(!t.dataset.showAllToggle)return;const e=document.createElement("button");e.innerHTML="Show next steps",e.classList.add("btn","btn-tertiary","show-all-toggle"),t.appendChild(e),e.addEventListener("click",()=>{t.classList.contains("show-all")?(e.innerHTML="Show next steps",t.classList.remove("show-all"),c("hide-future-items",t)):(e.innerHTML="Hide next steps",t.classList.add("show-all"),c("show-future-items",t))})},c=function(t,s){const e=new CustomEvent(t,{});s.dispatchEvent(e)},h=function(t){u(t)};r("iam-milestone-group");class m extends HTMLElement{constructor(){var s;super();const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",n=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,o=document.createElement("template");o.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"milestone-group.component.min.js","sources":["../_global.js","../../modules/milestone-group.js","milestone-group.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 showFuture = function (milestoneGroupElement) {\n const futureToggle = milestoneGroupElement.dataset.showAllToggle;\n if (!futureToggle) {\n return;\n }\n const toggleBtn = document.createElement('button');\n toggleBtn.innerHTML = 'Show next steps';\n toggleBtn.classList.add('btn', 'btn-tertiary', 'show-all-toggle');\n milestoneGroupElement.appendChild(toggleBtn);\n toggleBtn.addEventListener('click', () => {\n if (milestoneGroupElement.classList.contains('show-all')) {\n toggleBtn.innerHTML = 'Show next steps';\n milestoneGroupElement.classList.remove('show-all');\n toggleInteractionEvent('hide-future-items', milestoneGroupElement);\n }\n else {\n toggleBtn.innerHTML = 'Hide next steps';\n milestoneGroupElement.classList.add('show-all');\n toggleInteractionEvent('show-future-items', milestoneGroupElement);\n }\n });\n};\nconst toggleInteractionEvent = function (eventName, element) {\n const customEvent = new CustomEvent(eventName, {});\n element.dispatchEvent(customEvent);\n};\nconst milestoneGroup = function (milestoneGroupElement) {\n showFuture(milestoneGroupElement);\n};\nexport default milestoneGroup;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestoneGroup from '../../modules/milestone-group.js';\ntrackComponentRegistered('iam-milestone-group');\nclass iamMilestoneGroup extends HTMLElement {\n constructor() {\n var _a;\n super();\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 = `\
|
|
1
|
+
{"version":3,"file":"milestone-group.component.min.js","sources":["../_global.js","../../modules/milestone-group.js","milestone-group.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 showFuture = function (milestoneGroupElement) {\n const futureToggle = milestoneGroupElement.dataset.showAllToggle;\n if (!futureToggle) {\n return;\n }\n const toggleBtn = document.createElement('button');\n toggleBtn.innerHTML = 'Show next steps';\n toggleBtn.classList.add('btn', 'btn-tertiary', 'show-all-toggle');\n milestoneGroupElement.appendChild(toggleBtn);\n toggleBtn.addEventListener('click', () => {\n if (milestoneGroupElement.classList.contains('show-all')) {\n toggleBtn.innerHTML = 'Show next steps';\n milestoneGroupElement.classList.remove('show-all');\n toggleInteractionEvent('hide-future-items', milestoneGroupElement);\n }\n else {\n toggleBtn.innerHTML = 'Hide next steps';\n milestoneGroupElement.classList.add('show-all');\n toggleInteractionEvent('show-future-items', milestoneGroupElement);\n }\n });\n};\nconst toggleInteractionEvent = function (eventName, element) {\n const customEvent = new CustomEvent(eventName, {});\n element.dispatchEvent(customEvent);\n};\nconst milestoneGroup = function (milestoneGroupElement) {\n showFuture(milestoneGroupElement);\n};\nexport default milestoneGroup;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestoneGroup from '../../modules/milestone-group.js';\ntrackComponentRegistered('iam-milestone-group');\nclass iamMilestoneGroup extends HTMLElement {\n constructor() {\n var _a;\n super();\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 </style>\n <div class=\"milestone-group\" part=\"milestone-group\">\n <slot>\n </slot>\n </div>\n `;\n (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const milestoneGroupComponent = this;\n trackComponent(milestoneGroupComponent, 'iam-milestone-group', ['hide-future-items', 'show-future-items']);\n milestoneGroup(this);\n }\n}\nexport default iamMilestoneGroup;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","showFuture","milestoneGroupElement","toggleBtn","toggleInteractionEvent","element","customEvent","milestoneGroup","iamMilestoneGroup","_a","assetLocation","coreCSS","template"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,EACaC,EAAiB,CAACC,EAAWF,EAAeG,KAErD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,qBACP,QAASH,CACjB,CAAK,EACDG,EAAY,QAASC,GAAc,CAC/BF,EAAU,iBAAiBE,EAAW,SAAUC,EAAO,CACnD,MAAMC,EAAe,CACjB,MAAOF,EACP,QAASJ,EACT,OAAQK,EAAM,MAC9B,EACY,OAAO,KAAKA,EAAM,MAAM,EAAE,QAASE,GAAa,CAC5C,MAAMC,EAAcH,EAAM,OAAOE,CAAQ,EACzCD,EAAaC,CAAQ,EAAIC,CAC7B,CAAC,EACD,OAAO,UAAU,KAAKF,CAAY,CACtC,CAAC,CACL,CAAC,EACM,IC7BEG,EAAa,SAAUC,EAAuB,CAEvD,GAAI,CADiBA,EAAsB,QAAQ,cAE/C,OAEJ,MAAMC,EAAY,SAAS,cAAc,QAAQ,EACjDA,EAAU,UAAY,kBACtBA,EAAU,UAAU,IAAI,MAAO,eAAgB,iBAAiB,EAChED,EAAsB,YAAYC,CAAS,EAC3CA,EAAU,iBAAiB,QAAS,IAAM,CAClCD,EAAsB,UAAU,SAAS,UAAU,GACnDC,EAAU,UAAY,kBACtBD,EAAsB,UAAU,OAAO,UAAU,EACjDE,EAAuB,oBAAqBF,CAAqB,IAGjEC,EAAU,UAAY,kBACtBD,EAAsB,UAAU,IAAI,UAAU,EAC9CE,EAAuB,oBAAqBF,CAAqB,EAEzE,CAAC,CACL,EACME,EAAyB,SAAUR,EAAWS,EAAS,CACzD,MAAMC,EAAc,IAAI,YAAYV,EAAW,CAAA,CAAE,EACjDS,EAAQ,cAAcC,CAAW,CACrC,EACMC,EAAiB,SAAUL,EAAuB,CACpDD,EAAWC,CAAqB,CACpC,EC1BAX,EAAyB,qBAAqB,EAC9C,MAAMiB,UAA0B,WAAY,CACxC,aAAc,CACV,IAAIC,EACJ,MAAK,EACL,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;AAAA;AAAA;AAAA;AAAA;AAAA,OAObF,EAAK,KAAK,cAAgB,MAAQA,IAAO,QAAkBA,EAAG,YAAYG,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/G,CACA,mBAAoB,CAGhBnB,EADgC,KACQ,sBAAuB,CAAC,oBAAqB,mBAAmB,CAAC,EACzGc,EAAe,IAAI,CACvB,CACJ"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.5.1--beta1
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/const g=c=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:c})},y=(c,e,u)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:e}),u.forEach(l=>{c.addEventListener(l,function(i){const n={event:l,element:e,target:i.target};Object.keys(i.detail).forEach(d=>{const t=i.detail[d];n[d]=t}),window.dataLayer.push(n)})}),!0);g("iam-multi-step");class h extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const e=document.createElement("template");e.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
*,*:before,*:after{box-sizing:border-box}:host{--dialog-padding: 1.5rem;box-sizing:border-box;padding-top:calc(var(--dialog-padding)*4);display:block;position:relative;margin-right:0 !important;min-height:100%;padding-left:var(--dialog-padding)}@media screen and (min-width: 62em){:host{padding-top:var(--dialog-padding);padding-left:calc(var(--dialog-padding) + 17.625rem) !important;display:flex;flex-direction:column}}.steps{width:100%;position:absolute;top:0;left:0;padding:var(--dialog-padding);counter-reset:section;display:flex;justify-content:space-between;background-color:var(--colour-primary)}.steps:before{content:"";position:absolute;top:calc(50% - 1px);left:var(--dialog-padding);z-index:2;width:calc(100% - var(--dialog-padding) - var(--dialog-padding));height:2px;background:currentColor;z-index:1;background:linear-gradient(90deg, var(--colour-success) 0%, var(--colour-success) var(--progress, 0%), rgba(255, 255, 255, 0.5) var(--progress, 0%), rgba(255, 255, 255, 0.5) 100%)}.steps button{position:relative;background:rgba(0,0,0,0);border:none;color:hsla(0,0%,100%,.5);height:1.5rem;line-height:1.5rem;width:1.5rem;text-indent:300%;overflow:hidden;z-index:2;background-color:var(--colour-primary);outline:.5rem solid var(--colour-primary);cursor:pointer}.steps button:before{position:absolute;top:0;left:0;counter-increment:section;content:counter(section);border:1px solid currentColor;height:1.5rem;line-height:1.5rem;width:1.5rem;text-align:center;display:inline-block;text-indent:0;border-radius:50%}.steps button:not(.active):not(.valid){pointer-events:none}.steps button:not(.active):not(.valid):before{opacity:.5}.steps button.active{color:var(--colour-white)}.steps button.valid{color:var(--colour-success)}@
|
|
6
|
+
*,*:before,*:after{box-sizing:border-box}:host{--dialog-padding: 1.5rem;box-sizing:border-box;padding-top:calc(var(--dialog-padding)*4);display:block;position:relative;margin-right:0 !important;min-height:100%;padding-left:var(--dialog-padding)}@media screen and (min-width: 62em){:host{padding-top:var(--dialog-padding);padding-left:calc(var(--dialog-padding) + 17.625rem) !important;display:flex;flex-direction:column}}.steps{width:100%;position:absolute;top:0;left:0;padding:var(--dialog-padding);counter-reset:section;display:flex;justify-content:space-between;background-color:var(--colour-primary)}.steps:before{content:"";position:absolute;top:calc(50% - 1px);left:var(--dialog-padding);z-index:2;width:calc(100% - var(--dialog-padding) - var(--dialog-padding));height:2px;background:currentColor;z-index:1;background:linear-gradient(90deg, var(--colour-success) 0%, var(--colour-success) var(--progress, 0%), rgba(255, 255, 255, 0.5) var(--progress, 0%), rgba(255, 255, 255, 0.5) 100%)}.steps button{position:relative;background:rgba(0,0,0,0);border:none;color:hsla(0,0%,100%,.5);height:1.5rem;line-height:1.5rem;width:1.5rem;text-indent:300%;overflow:hidden;z-index:2;background-color:var(--colour-primary);outline:.5rem solid var(--colour-primary);cursor:pointer}.steps button:before{position:absolute;top:0;left:0;counter-increment:section;content:counter(section);border:1px solid currentColor;height:1.5rem;line-height:1.5rem;width:1.5rem;text-align:center;display:inline-block;text-indent:0;border-radius:50%}.steps button:not(.active):not(.valid){pointer-events:none}.steps button:not(.active):not(.valid):before{opacity:.5}.steps button.active{color:var(--colour-white)}.steps button.valid{color:var(--colour-success)}@container style(--theme: dark){.steps button{color:rgba(0,0,0,.5)}.steps button.active{color:#000}.steps button.valid{color:var(--colour-complete)}}@media screen and (min-width: 62em){.steps{width:17.625rem;height:100%;flex-direction:column;justify-content:center}.steps:before{display:none}.steps button{margin-block:.5rem;width:100%;text-indent:0;text-align:left;padding-left:2rem;font-size:1.125rem;outline-width:1px}}/*# sourceMappingURL=assets/css/components/multi-step.component.css.map */
|
|
7
7
|
|
|
8
8
|
</style>
|
|
9
9
|
<div class="steps" parts="steps">
|
|
10
10
|
</div>
|
|
11
11
|
<slot></slot>
|
|
12
|
-
`,this.shadowRoot.appendChild(e.content.cloneNode(!0))}connectedCallback(){const e=this,u=this.shadowRoot.querySelector(".steps"),l=this.querySelector("form"),i=Array.from(e.querySelectorAll("fieldset[data-title]"));i.forEach((t,a)=>{u.insertAdjacentHTML("beforeend",`<button data-title="${t.getAttribute("data-title")}" type="button" class="${a==0?"active":""}" tabindex="-1">${t.getAttribute("data-title")}</button>`),a===0&&t.classList.add("active");const o=document.createElement("div");if(o.classList.add("btn--wrapper"),t.appendChild(o),a!=0&&(o.innerHTML+=`<button data-title="${i[a-1].getAttribute("data-title")}" class="btn btn-secondary mb-0" data-previous type="button">Previous</button>`),a!=i.length-1&&(o.innerHTML+=`<button data-title="${i[a+1].getAttribute("data-title")}" class="btn btn-primary mb-0" data-next type="button">Next</button>`),a==i.length-1)if(l&&l.querySelector(':scope > button[type="submit"]')){const s=l.querySelector(':scope > button[type="submit"]');s.classList.add("mb-0"),o.insertAdjacentElement("beforeend",s)}else o.innerHTML+=`<button data-title="${i[a].getAttribute("data-title")}" class="btn btn-primary mb-0" data-next type="submit">Submit</button>`});const n=Array.from(e.querySelectorAll("fieldset.was-validated"));for(let t=0;t<n.length;t++){const a=n[t],o=a.getAttribute("data-title");if(a.querySelector(".is-invalid")){Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(s=>{s.classList.add("active")});break}else Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(s=>{s.classList.add("valid")})}e.addEventListener("invalid",function(){return function(t){t.preventDefault()}}(),!0);function d(t){const a=e.querySelector("fieldset.active")?e.querySelector("fieldset.active"):e.querySelector("fieldset[data-title]"),o=a.getAttribute("data-title");let s=!0;if(a.classList.add("was-validated"),Array.from(a.querySelectorAll("input")).forEach(r=>{r.checkValidity()||(s=!1)}),s?(Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.add("valid")}),Array.from(e.shadowRoot.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.add("valid")})):(Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.remove("valid")}),Array.from(e.shadowRoot.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.remove("valid")})),s||!t.hasAttribute("data-next")){const r=e.querySelector(`fieldset[data-title="${t.getAttribute("data-title")}"]`),f=e.shadowRoot.querySelector(`.steps button[data-title="${t.getAttribute("data-title")}"]`);Array.from(e.querySelectorAll("button")).forEach(p=>{p.classList.remove("active")}),Array.from(e.querySelectorAll("fieldset")).forEach(p=>{p.classList.remove("active")}),f.classList.add("active"),r.classList.add("active")}const b=Array.from(e.querySelectorAll("fieldset")).length,m=Array.from(e.querySelectorAll("fieldset.valid")).length;e.style.setProperty("--progress",`${m/(b-1)*100}%`)}e.addEventListener("keydown",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button")){const a=t.target.closest("button");t.keyCode==13&&a.getAttribute("type")!="submit"&&(t.preventDefault(),d(a))}t&&t.target instanceof HTMLElement&&t.target.closest("input")&&(t.target.closest("input").classList.remove("is-invalid"),t.keyCode==13&&t.preventDefault())}),e.addEventListener("click",t=>(t&&t.target instanceof HTMLElement&&t.target.closest('button[type="submit"]')&&t.target.closest("form").classList.add("was-validated"),null)),e.shadowRoot.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button[data-title]")){const a=t.target.closest("button[data-title]");d(a)}return null}),y(e,"iam-multi-step",[])}static get observedAttributes(){return["data-image"]}attributeChangedCallback(e,u,l){switch(e){case"data-total":{this.shadowRoot.querySelector(".card__total")&&(this.shadowRoot.querySelector(".card__total").innerHTML=l);break}}}}export{h as default};
|
|
12
|
+
`,this.shadowRoot.appendChild(e.content.cloneNode(!0))}connectedCallback(){const e=this,u=this.shadowRoot.querySelector(".steps"),l=this.querySelector("form"),i=Array.from(e.querySelectorAll("fieldset[data-title]"));i.forEach((t,a)=>{u.insertAdjacentHTML("beforeend",`<button data-title="${t.getAttribute("data-title")}" type="button" class="${a==0?"active":""}" tabindex="-1">${t.getAttribute("data-title")}</button>`),a===0&&t.classList.add("active");const o=document.createElement("div");if(o.classList.add("btn--wrapper"),t.appendChild(o),a!=0&&(o.innerHTML+=`<button data-title="${i[a-1].getAttribute("data-title")}" class="btn btn-secondary mb-0" data-previous type="button">Previous</button>`),a!=i.length-1&&(o.innerHTML+=`<button data-title="${i[a+1].getAttribute("data-title")}" class="btn btn-primary mb-0" data-next type="button">Next</button>`),a==i.length-1)if(l&&l.querySelector(':scope > button[type="submit"]')){const s=l.querySelector(':scope > button[type="submit"]');s.classList.add("mb-0"),o.insertAdjacentElement("beforeend",s)}else o.innerHTML+=`<button data-title="${i[a].getAttribute("data-title")}" class="btn btn-primary mb-0" data-next type="submit">Submit</button>`});const n=Array.from(e.querySelectorAll("fieldset.was-validated"));for(let t=0;t<n.length;t++){const a=n[t],o=a.getAttribute("data-title");if(a.querySelector(".is-invalid")){Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(s=>{s.classList.add("active")});break}else Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(s=>{s.classList.add("valid")})}e.addEventListener("invalid",(function(){return function(t){t.preventDefault()}})(),!0);function d(t){const a=e.querySelector("fieldset.active")?e.querySelector("fieldset.active"):e.querySelector("fieldset[data-title]"),o=a.getAttribute("data-title");let s=!0;if(a.classList.add("was-validated"),Array.from(a.querySelectorAll("input")).forEach(r=>{r.checkValidity()||(s=!1)}),s?(Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.add("valid")}),Array.from(e.shadowRoot.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.add("valid")})):(Array.from(e.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.remove("valid")}),Array.from(e.shadowRoot.querySelectorAll(`[data-title="${o}"]`)).forEach(r=>{r.classList.remove("valid")})),s||!t.hasAttribute("data-next")){const r=e.querySelector(`fieldset[data-title="${t.getAttribute("data-title")}"]`),f=e.shadowRoot.querySelector(`.steps button[data-title="${t.getAttribute("data-title")}"]`);Array.from(e.querySelectorAll("button")).forEach(p=>{p.classList.remove("active")}),Array.from(e.querySelectorAll("fieldset")).forEach(p=>{p.classList.remove("active")}),f.classList.add("active"),r.classList.add("active")}const b=Array.from(e.querySelectorAll("fieldset")).length,m=Array.from(e.querySelectorAll("fieldset.valid")).length;e.style.setProperty("--progress",`${m/(b-1)*100}%`)}e.addEventListener("keydown",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button")){const a=t.target.closest("button");t.keyCode==13&&a.getAttribute("type")!="submit"&&(t.preventDefault(),d(a))}t&&t.target instanceof HTMLElement&&t.target.closest("input")&&(t.target.closest("input").classList.remove("is-invalid"),t.keyCode==13&&t.preventDefault())}),e.addEventListener("click",t=>(t&&t.target instanceof HTMLElement&&t.target.closest('button[type="submit"]')&&t.target.closest("form").classList.add("was-validated"),null)),e.shadowRoot.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button[data-title]")){const a=t.target.closest("button[data-title]");d(a)}return null}),y(e,"iam-multi-step",[])}static get observedAttributes(){return["data-image"]}attributeChangedCallback(e,u,l){switch(e){case"data-total":{this.shadowRoot.querySelector(".card__total")&&(this.shadowRoot.querySelector(".card__total").innerHTML=l);break}}}}export{h as default};
|
|
13
13
|
//# sourceMappingURL=multi-step.component.min.js.map
|