@iamproperty/components 4.1.1-beta-3 → 4.1.1-beta-5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/assets/css/components/actionbar-global.css.map +1 -1
  2. package/assets/css/components/actionbar.css +1 -1
  3. package/assets/css/components/actionbar.css.map +1 -1
  4. package/assets/css/components/address-lookup.css +1 -1
  5. package/assets/css/components/address-lookup.css.map +1 -1
  6. package/assets/css/components/admin-panel.css +1 -1
  7. package/assets/css/components/admin-panel.css.map +1 -1
  8. package/assets/css/components/card.css +1 -1
  9. package/assets/css/components/card.css.map +1 -1
  10. package/assets/css/components/component.reset.css +1 -0
  11. package/assets/css/components/component.reset.css.map +1 -0
  12. package/assets/css/components/dialog.css +1 -1
  13. package/assets/css/components/dialog.css.map +1 -1
  14. package/assets/css/components/header.css.map +1 -1
  15. package/assets/css/components/lists.css.map +1 -1
  16. package/assets/css/components/nav-global.css.map +1 -1
  17. package/assets/css/components/nav.css +1 -1
  18. package/assets/css/components/nav.css.map +1 -1
  19. package/assets/css/components/nav.old.css.map +1 -1
  20. package/assets/css/components/pagination.css.map +1 -1
  21. package/assets/css/components/property-searchbar.css.map +1 -1
  22. package/assets/css/components/table.extras.css.map +1 -1
  23. package/assets/css/components/table.global.css.map +1 -1
  24. package/assets/css/components/tabs.css +1 -1
  25. package/assets/css/components/tabs.css.map +1 -1
  26. package/assets/css/core.min.css +1 -1
  27. package/assets/css/core.min.css.map +1 -1
  28. package/assets/css/style.min.css +1 -1
  29. package/assets/css/style.min.css.map +1 -1
  30. package/assets/js/components/accordion/accordion.component.min.js +1 -1
  31. package/assets/js/components/actionbar/actionbar.component.js +1 -1
  32. package/assets/js/components/actionbar/actionbar.component.min.js +3 -3
  33. package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
  34. package/assets/js/components/address-lookup/address-lookup.component.js +35 -2
  35. package/assets/js/components/address-lookup/address-lookup.component.min.js +10 -6
  36. package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
  37. package/assets/js/components/applied-filters/applied-filters.component.min.js +1 -1
  38. package/assets/js/components/card/card.component.min.js +2 -2
  39. package/assets/js/components/collapsible-side/collapsible-side.component.min.js +1 -1
  40. package/assets/js/components/fileupload/fileupload.component.min.js +21 -0
  41. package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -0
  42. package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
  43. package/assets/js/components/header/header.component.min.js +1 -1
  44. package/assets/js/components/nav/nav.component.min.js +2 -2
  45. package/assets/js/components/notification/notification.component.min.js +1 -1
  46. package/assets/js/components/pagination/pagination.component.js +1 -1
  47. package/assets/js/components/pagination/pagination.component.min.js +2 -2
  48. package/assets/js/components/pagination/pagination.component.min.js.map +1 -1
  49. package/assets/js/components/table/table.component.min.js +1 -1
  50. package/assets/js/components/tabs/tabs.component.min.js +1 -1
  51. package/assets/js/dynamic.min.js +1 -1
  52. package/assets/js/modules/dynamicEvents.js +20 -23
  53. package/assets/js/scripts.bundle.js +2 -2
  54. package/assets/js/scripts.bundle.js.map +1 -1
  55. package/assets/js/scripts.bundle.min.js +2 -2
  56. package/assets/js/scripts.bundle.min.js.map +1 -1
  57. package/assets/sass/_corefiles.scss +126 -49
  58. package/assets/sass/_elements.scss +18 -0
  59. package/assets/sass/_func.scss +1 -0
  60. package/assets/sass/_functions/mixins.scss +13 -0
  61. package/assets/sass/_utilities.scss +18 -0
  62. package/assets/sass/components/actionbar.scss +2 -1
  63. package/assets/sass/components/address-lookup.scss +9 -0
  64. package/assets/sass/components/admin-panel.scss +2 -69
  65. package/assets/sass/components/card.scss +9 -9
  66. package/assets/sass/components/component.reset.scss +44 -0
  67. package/assets/sass/components/dialog.scss +3 -1
  68. package/assets/sass/components/nav.scss +4 -4
  69. package/assets/sass/components/tabs.scss +69 -1
  70. package/assets/sass/foundations/buttons.scss +10 -3
  71. package/assets/sass/foundations/reboot.scss +0 -87
  72. package/assets/sass/foundations/root.scss +6 -4
  73. package/assets/sass/helpers/dynamic.scss +13 -1
  74. package/assets/ts/components/actionbar/actionbar.component.ts +1 -1
  75. package/assets/ts/components/address-lookup/address-lookup.component.ts +51 -4
  76. package/assets/ts/components/pagination/pagination.component.ts +1 -1
  77. package/assets/ts/modules/dynamicEvents.ts +23 -23
  78. package/dist/components.es.js +15 -15
  79. package/dist/components.umd.js +55 -47
  80. package/dist/style.css +1 -1
  81. package/package.json +1 -1
@@ -1,8 +1,10 @@
1
1
  @use "../func" as *;
2
2
 
3
- @import "../../bootstrap/scss/_root.scss";
3
+ //@import "../../bootstrap/scss/_root.scss";
4
4
 
5
- :root {
5
+ $root: ':root'!default;
6
+
7
+ #{$root} {
6
8
  // Print out the $vars array setup in the variables file so they can be used as CSS vars
7
9
  // Custom variable values only support SassScript inside `#{}`.
8
10
  @each $var, $value in $vars {
@@ -40,7 +42,7 @@
40
42
 
41
43
  // Dark mode; functional colours get updated
42
44
  @include dark-mode() {
43
- :root {
45
+ #{$root} {
44
46
 
45
47
  @each $color, $value in $dark-mode-colors {
46
48
  --colour-#{$color}: #{$value};
@@ -110,7 +112,7 @@
110
112
 
111
113
 
112
114
  @media (forced-colors: active) {
113
- :root {
115
+ #{$root} {
114
116
  --contrast-outline-width: 1px;
115
117
  }
116
118
  }
@@ -1,3 +1,15 @@
1
- .js-hide {
1
+ body.js-enabled .js-hide {
2
+ display: none!important;
3
+ }
4
+
5
+ body:not(.js-enabled) .js-show {
6
+ display: none!important;
7
+ }
8
+
9
+ :host-context(body.js-enabled) .js-hide {
10
+ display: none!important;
11
+ }
12
+
13
+ :host-context(body:not(.js-enabled)) .js-show {
2
14
  display: none!important;
3
15
  }
@@ -66,7 +66,7 @@ class iamActionbar extends HTMLElement {
66
66
  <slot name="menu"></slot>
67
67
  </dialog>
68
68
  </div>
69
- <button class="btn btn-secondary btn-compact btn-sm fa-search m-0" data-search="">Search</button>
69
+ <button class="btn btn-secondary btn-compact btn-sm fa-search" data-search="">Search</button>
70
70
  </div>
71
71
  </div>
72
72
  </div>
@@ -32,7 +32,7 @@ class iamAddressLookup extends HTMLElement {
32
32
 
33
33
  <div class="postcode-lookup">
34
34
  <div>
35
- <label class="mb-2">Search property address <span class="optional">(Optional)</span>
35
+ <label class="mb-2">Search <span class="title text-lowercase"></span> <span class="optional">(Optional)</span>
36
36
  <span>
37
37
  <input type="text" name="postcode" list="address-lookup__addressess" autoComplete="new-password" aria-autocomplete="none" placeholder="Postcode" />
38
38
  <span class="suffix fa-regular fa-search"></span>
@@ -49,6 +49,10 @@ class iamAddressLookup extends HTMLElement {
49
49
  <slot></slot>
50
50
  <button class="btn btn-tertiary switch-to-lookup-btn">Use postcode lookup</button>
51
51
  </div>
52
+ <div class="pre-filled pb-2 js-hide">
53
+ <strong class="title text-primary d-block"></strong>
54
+ <p><span class="pre-filled-address"></span><button class="text-primary text-decoration-none ms-1 cursor-pointer"><i class="fa-regular fa-pen-to-square"></i><span class="visually-hidden">Edit</span></button></p>
55
+ </div>
52
56
  </div>
53
57
  `;
54
58
  this.shadowRoot.appendChild(template.content.cloneNode(true));
@@ -60,9 +64,40 @@ class iamAddressLookup extends HTMLElement {
60
64
  const lookup = this.shadowRoot.querySelector('[name="postcode"]');
61
65
  const lookupWrapper = this.shadowRoot.querySelector('.postcode-lookup');
62
66
  const manualWrapper = this.shadowRoot.querySelector('.manual-address');
67
+ const preFilledWrapper = this.shadowRoot.querySelector('.pre-filled');
63
68
  const list = this.shadowRoot.querySelector('datalist');
64
69
  const switchManualBtn = this.shadowRoot.querySelector('.switch-to-manual-btn');
65
70
  const switchLookupBtn = this.shadowRoot.querySelector('.switch-to-lookup-btn');
71
+ const title = this.hasAttribute('data-title') ? this.getAttribute('data-title') : "Property address";
72
+
73
+ let preFilled = true;
74
+
75
+ const preFilledAddress = this.shadowRoot.querySelector('.pre-filled-address');
76
+ const preFilledAddressBtn = this.shadowRoot.querySelector('.pre-filled-address + button');
77
+
78
+
79
+ Array.from(this.shadowRoot.querySelectorAll('.title')).forEach((titleElement, index) => {
80
+
81
+ titleElement.innerHTML = title;
82
+ });
83
+
84
+
85
+ Array.from(this.querySelectorAll('input[required],input[data-required],select[required],select[data-required]')).forEach((input, index) => {
86
+
87
+ if(!input.value)
88
+ preFilled = false;
89
+ else
90
+ preFilledAddress.innerHTML += ', '+input.value;
91
+
92
+ });
93
+
94
+ preFilledAddress.innerHTML = preFilledAddress.innerHTML.slice(1);
95
+
96
+ if(preFilled){
97
+ preFilledWrapper.classList.remove('js-hide');
98
+ lookupWrapper.classList.add('js-hide');
99
+ manualWrapper.classList.add('js-hide');
100
+ }
66
101
 
67
102
  if(this.hasAttribute('data-use')){
68
103
 
@@ -97,20 +132,32 @@ class iamAddressLookup extends HTMLElement {
97
132
  });
98
133
  }
99
134
 
100
-
101
- switchManualBtn.addEventListener('click', (event) => {
102
-
135
+ function openManualWrapper (){
103
136
  lookupWrapper.classList.add('js-hide');
104
137
  manualWrapper.classList.remove('js-hide');
105
138
 
106
139
  Array.from(this.querySelectorAll('[data-required]')).forEach((input, index) => {
107
140
  input.setAttribute('required','true');
108
141
  });
142
+
143
+ manualWrapper.scrollIntoView();
144
+ }
145
+
146
+ preFilledAddressBtn.addEventListener('click', (event) => {
147
+
148
+ preFilledWrapper.classList.add('js-hide');
149
+ openManualWrapper();
150
+ });
151
+ switchManualBtn.addEventListener('click', (event) => {
152
+
153
+ openManualWrapper();
109
154
  });
110
155
  switchLookupBtn.addEventListener('click', (event) => {
111
156
 
112
157
  lookupWrapper.classList.remove('js-hide');
113
158
  manualWrapper.classList.add('js-hide');
159
+
160
+ lookupWrapper.scrollIntoView();
114
161
  });
115
162
 
116
163
 
@@ -208,7 +208,7 @@ class iamPagination extends HTMLElement {
208
208
  }
209
209
  case "data-page": {
210
210
 
211
- if(oldVal != newVal) {
211
+ if(oldVal && oldVal != newVal) {
212
212
 
213
213
  this.setup();
214
214
  // Dispact the event for other components to use as triggers
@@ -6,26 +6,22 @@ const createDynamicEvents = () => {
6
6
  // Change event
7
7
  document.addEventListener('change', (event) => {
8
8
  if (event && event.target instanceof HTMLElement && event.target.closest('[data-change-events]'))
9
- readMatches(event.target,event.target.closest('[data-change-events]').getAttribute('data-change-events'));
10
- });
11
- document.addEventListener('change', (event) => {
12
- if (event && event.target instanceof HTMLElement && event.target.closest('[data-change-events]'))
13
- readMatches(event.target,event.target.closest('[data-change-events]').getAttribute('data-change-events'));
9
+ splitEvents(event.target,event.target.closest('[data-change-events]').getAttribute('data-change-events'));
14
10
  });
15
11
  document.addEventListener('keyup', (event) => {
16
12
  if (event && event.target instanceof HTMLElement && event.target.closest('[data-change-events]'))
17
- readMatches(event.target,event.target.closest('[data-change-events]').getAttribute('data-change-events'));
13
+ splitEvents(event.target,event.target.closest('[data-change-events]').getAttribute('data-change-events'));
18
14
  });
19
15
 
20
16
  // Click event
21
17
  document.addEventListener('click', (event) => {
22
18
  if (event && event.target instanceof HTMLElement && event.target.closest('[data-click-events]'))
23
- readMatches(event.target,event.target.closest('[data-click-events]').getAttribute('data-click-events'));
19
+ splitEvents(event.target,event.target.closest('[data-click-events]').getAttribute('data-click-events'));
24
20
  });
25
21
  };
26
22
 
27
23
  // Parse the JSON and trigger the events, this may be singular or multiple set of events
28
- const readMatches = (element,events) => {
24
+ const splitEvents = (element,events) => {
29
25
 
30
26
  // an empty events will trigger looking up the dom chain for
31
27
  if(!events){
@@ -38,11 +34,11 @@ const readMatches = (element,events) => {
38
34
 
39
35
  // Split out each event
40
36
  Array.from(JSON.parse(events)).forEach((event, index) => {
41
- checkMatch(element,event);
37
+ checkConditions(element,event);
42
38
  });
43
39
  };
44
40
 
45
- const checkMatch = (element,event) => {
41
+ const checkConditions = (element,event) => {
46
42
 
47
43
  if("matches" in event){
48
44
  if(event['matches'] == 'any')
@@ -55,12 +51,16 @@ const checkMatch = (element,event) => {
55
51
  return false;
56
52
  }
57
53
  else if("in-list" in event){
54
+
55
+ // Pass the matched datalist element instead of the triggered element
56
+ let match = document.querySelector(`${event['in-list']} option[value="${element.value}"]`);
57
+
58
58
  if(document.querySelector(`${event['in-list']} option[value="${element.value}"]`)){
59
- let match = document.querySelector(`${event['in-list']} option[value="${element.value}"]`);
60
- runEvent(element,event,'if',match);
59
+
60
+ runEvent(match,event,'if');
61
61
  }
62
62
  else
63
- runEvent(element,event,'else');
63
+ runEvent(match,event,'else');
64
64
 
65
65
  return false;
66
66
  }
@@ -69,7 +69,7 @@ const checkMatch = (element,event) => {
69
69
  }
70
70
  };
71
71
 
72
- const runEvent = (element,event,eventType,match) => {
72
+ const runEvent = (element,event,eventType) => {
73
73
 
74
74
  if(eventType in event == false)
75
75
  return false;
@@ -97,7 +97,7 @@ const runEvent = (element,event,eventType,match) => {
97
97
  });
98
98
  break;
99
99
  case "populate-form":
100
- populateForm(element,event,match);
100
+ populateForm(element,event);
101
101
  break;
102
102
  case "setAttribute":
103
103
  document.querySelector(`${event['target']}`).setAttribute(event['attribute'],event['value']);
@@ -116,27 +116,27 @@ const runEvent = (element,event,eventType,match) => {
116
116
  }
117
117
  }
118
118
 
119
- const populateForm = function (element,event,match) {
119
+ const populateForm = function (element,event) {
120
120
 
121
- let response = JSON.parse(match.getAttribute('data-values'));
121
+ let values = JSON.parse(element.getAttribute('data-values'));
122
122
  let form = document.querySelector(event['target']);
123
123
 
124
- Object.keys(response).forEach((field, index) => {
124
+ Object.keys(values).forEach((field, index) => {
125
125
 
126
126
  if(document.getElementById(field) && document.getElementById(field).tagName == "SPAN")
127
- document.getElementById(field).innerHTML = response[field];
127
+ document.getElementById(field).innerHTML = values[field];
128
128
 
129
- if(form.querySelector(`input[name="${field}"][type="radio"][value="${response[field]}"]`)){
129
+ if(form.querySelector(`input[name="${field}"][type="radio"][value="${values[field]}"]`)){
130
130
 
131
131
  Array.from(form.querySelectorAll(`input[name="${field}"][type="radio"]`)).forEach(function(input,index){
132
132
  input.disabled = true;
133
133
  });
134
134
 
135
- form.querySelector(`input[name="${field}"][type="radio"][value="${response[field]}"]`).checked = true;
136
- form.querySelector(`input[name="${field}"][type="radio"][value="${response[field]}"]`).disabled = false;
135
+ form.querySelector(`input[name="${field}"][type="radio"][value="${values[field]}"]`).checked = true;
136
+ form.querySelector(`input[name="${field}"][type="radio"][value="${values[field]}"]`).disabled = false;
137
137
  }
138
138
  else if(form.querySelector(`input[name="${field}"]`)){
139
- form.querySelector(`input[name="${field}"]`).value = response[field];
139
+ form.querySelector(`input[name="${field}"]`).value = values[field];
140
140
  form.querySelector(`input[name="${field}"]`).setAttribute('readonly','true');
141
141
  }
142
142
  });
@@ -48,7 +48,7 @@ function At(e, a, t, i, s, r) {
48
48
  }
49
49
  const Xo = /* @__PURE__ */ A(yt, [["render", At]]);
50
50
  /*!
51
- * iamKey v4.1.1-beta-3
51
+ * iamKey v4.1.1-beta-5
52
52
  * Copyright 2022-2023 iamproperty
53
53
  */
54
54
  const _t = function(e) {
@@ -557,7 +557,7 @@ class Ct extends HTMLElement {
557
557
  }
558
558
  }
559
559
  /*!
560
- * iamKey v4.1.1-beta-3
560
+ * iamKey v4.1.1-beta-5
561
561
  * Copyright 2022-2023 iamproperty
562
562
  */
563
563
  let nt = class extends HTMLElement {
@@ -654,7 +654,7 @@ let nt = class extends HTMLElement {
654
654
  break;
655
655
  }
656
656
  case "data-page": {
657
- t != i && (this.setup(), this.dispatchEvent(new CustomEvent("update-page", { detail: { page: i } })));
657
+ t && t != i && (this.setup(), this.dispatchEvent(new CustomEvent("update-page", { detail: { page: i } })));
658
658
  break;
659
659
  }
660
660
  }
@@ -1143,7 +1143,7 @@ function be(e, a, t, i, s, r) {
1143
1143
  }
1144
1144
  const Qo = /* @__PURE__ */ A(pe, [["render", be]]);
1145
1145
  /*!
1146
- * iamKey v4.1.1-beta-3
1146
+ * iamKey v4.1.1-beta-5
1147
1147
  * Copyright 2022-2023 iamproperty
1148
1148
  */
1149
1149
  function fe(e) {
@@ -1294,7 +1294,7 @@ const ai = /* @__PURE__ */ A(ke, [["render", He]]), Ce = {
1294
1294
  name: "Card",
1295
1295
  mounted() {
1296
1296
  this.$nextTick(function() {
1297
- import("./card.component.min-ce4c015c.mjs").then((e) => {
1297
+ import("./card.component.min-1e6bae1b.mjs").then((e) => {
1298
1298
  window.customElements.get("iam-card") || window.customElements.define("iam-card", e.default);
1299
1299
  }).catch((e) => {
1300
1300
  console.log(e.message);
@@ -1495,7 +1495,7 @@ function We(e, a, t, i, s, r) {
1495
1495
  }
1496
1496
  const oi = /* @__PURE__ */ A(De, [["render", We]]);
1497
1497
  /*!
1498
- * iamKey v4.1.1-beta-3
1498
+ * iamKey v4.1.1-beta-5
1499
1499
  * Copyright 2022-2023 iamproperty
1500
1500
  */
1501
1501
  window.dataLayer = window.dataLayer || [], window.dataLayer.push({ event: "customElementRegistered", element: "header" });
@@ -1941,7 +1941,7 @@ const si = /* @__PURE__ */ A(va, [["render", Ha]]), Ca = {
1941
1941
  name: "Nav",
1942
1942
  mounted() {
1943
1943
  this.$nextTick(function() {
1944
- import("./nav.component.min-09f60243.mjs").then((e) => {
1944
+ import("./nav.component.min-16baebe2.mjs").then((e) => {
1945
1945
  window.customElements.get("iam-nav") || window.customElements.define("iam-nav", e.default);
1946
1946
  }).catch((e) => {
1947
1947
  console.log(e.message);
@@ -2058,7 +2058,7 @@ function Za(e, a, t, i, s, r) {
2058
2058
  }
2059
2059
  const ui = /* @__PURE__ */ A(Xa, [["render", Za]]);
2060
2060
  /*!
2061
- * iamKey v4.1.1-beta-3
2061
+ * iamKey v4.1.1-beta-5
2062
2062
  * Copyright 2022-2023 iamproperty
2063
2063
  */
2064
2064
  const to = function(e) {
@@ -2259,7 +2259,7 @@ function vo(e, a, t, i, s, r) {
2259
2259
  }
2260
2260
  const bi = /* @__PURE__ */ A(ho, [["render", vo]]);
2261
2261
  /*!
2262
- * iamKey v4.1.1-beta-3
2262
+ * iamKey v4.1.1-beta-5
2263
2263
  * Copyright 2022-2023 iamproperty
2264
2264
  */
2265
2265
  function wo(e, a) {
@@ -2350,7 +2350,7 @@ function xo(e, a, t, i, s, r) {
2350
2350
  }
2351
2351
  const gi = /* @__PURE__ */ A(_o, [["render", xo]]);
2352
2352
  /*!
2353
- * iamKey v4.1.1-beta-3
2353
+ * iamKey v4.1.1-beta-5
2354
2354
  * Copyright 2022-2023 iamproperty
2355
2355
  */
2356
2356
  function Lo(e, a) {
@@ -2517,7 +2517,7 @@ function Co(e, a, t, i, s, r) {
2517
2517
  }
2518
2518
  const vi = /* @__PURE__ */ A(Ho, [["render", Co]]);
2519
2519
  /*!
2520
- * iamKey v4.1.1-beta-3
2520
+ * iamKey v4.1.1-beta-5
2521
2521
  * Copyright 2022-2023 iamproperty
2522
2522
  */
2523
2523
  const Ro = function(e) {
@@ -2697,7 +2697,7 @@ class Do extends HTMLElement {
2697
2697
  i.innerHTML = `
2698
2698
  <style>
2699
2699
  @import "${t}";
2700
- .actionbar__wrapper{position:relative;z-index:10;height:4.25rem;container-type:inline-size}.views,.selectall{position:absolute !important;top:50%;left:1.5rem;transform:translate(0, -50%);z-index:10}@media screen and (min-width: 36em){.views,.selectall{left:2rem}}.views .btn-action:not(:last-child),.selectall .btn-action:not(:last-child){margin-right:0.25rem !important}.selectall{width:2.5rem;overflow:hidden}.selectall label{height:2.5rem}@media screen and (min-width: 36em){.selectall{width:auto;overflow:visible}}.actionbar [data-search]{display:none}:host([data-search]) .actionbar [data-search]{display:block;margin-left:1rem !important}:is(.actionbar,.actionbar--selected,.actionbar--search){border-top-left-radius:0.625rem;border-top-right-radius:0.625rem;padding:0 1.5rem;flex-wrap:nowrap;justify-content:flex-end;align-items:center;height:4.25rem;inset:0}@supports selector(:has(*)){:is(.actionbar,.actionbar--selected,.actionbar--search){position:absolute}}@container (width > 23.4375em){:is(.actionbar,.actionbar--selected,.actionbar--search){padding:0 2rem}}.actionbar{display:flex}.actionbar--selected{background-color:var(--colour-canvas);display:flex;pointer-events:none}@media screen and (prefers-color-scheme: light){.actionbar--selected{background-color:#e6eaec}}@supports selector(:has(*)){.actionbar--selected{opacity:0}}.actionbar--search{background-color:var(--colour-canvas);display:flex;z-index:2;position:relative;opacity:0;pointer-events:none}@media screen and (prefers-color-scheme: light){.actionbar--search{background-color:#e6eaec}}.selectall:has(input:checked)~.actionbar,.selectall:has(input:indeterminate)~.actionbar{opacity:0;pointer-events:none}.selectall:has(input:checked)~.actionbar--selected,.selectall:has(input:indeterminate)~.actionbar--selected{opacity:1;pointer-events:all}.actionbar--search.show{opacity:1;pointer-events:all}.actionbar__wrapper:has(.actionbar--search.show)>*:not(.actionbar--search.show){opacity:0;pointer-events:none}::slotted(*:not([slot=overflow])){margin-top:0 !important;margin-bottom:0 !important;margin-left:1rem !important;margin-right:0 !important}::slotted(.btn:not(.btn-action)){order:2}::slotted([data-single]){pointer-events:none;opacity:.5}:host([data-selected="1"]) ::slotted([data-single]){pointer-events:all;opacity:1}::slotted(hr){height:2rem;color:#9d9d9d !important;width:1px;display:none}@container (width > 48em){::slotted(hr){display:block}}.safe-area{display:flex;flex-wrap:nowrap;justify-content:flex-end;align-items:center;width:13.125rem;overflow:visible;position:relative}@container (width > 23.4375em){.safe-area{width:28.125rem}}@container (width > 48em){.safe-area{width:46.875rem}}.safe-area .body{display:contents}:host([data-switchviews]) .safe-area{width:9rem}::slotted(.btn-compact[slot=selected-overflow]),::slotted(.btn-compact[slot=overflow]){max-width:none !important;text-indent:0 !important;width:auto !important;text-align:left !important;padding-left:0 !important;background:none !important;border:none !important}::slotted(.btn-compact[slot=selected-overflow]):before,::slotted(.btn-compact[slot=overflow]):before{position:static !important;line-height:inherit !important}.dialog__wrapper.dialog-overflow{margin-left:.5rem;margin-right:-0.5rem}.actionbar--search .btn{margin-left:-0.75rem !important;margin-right:auto !important}.search-wrapper{width:calc(100% - 3.25rem);max-width:21.875rem !important;margin:0 !important}@container (width > 48em){.search-wrapper{max-width:28.125rem !important}}.search-wrapper input{padding-top:0.5rem;padding-bottom:0.5rem;min-height:2.5rem !important;max-height:2.5rem !important}.search-wrapper :is(.prefix,.suffix){padding:0.5rem !important;min-height:2.5rem !important;max-height:2.5rem !important;min-width:2.5rem !important;max-width:2.5rem !important;line-height:1.5rem !important}/*# sourceMappingURL=assets/css/components/actionbar.css.map */
2700
+ .actionbar__wrapper{position:relative;z-index:10;height:4.25rem;container-type:inline-size}.views,.selectall{position:absolute !important;top:50%;left:1.5rem;transform:translate(0, -50%);z-index:10}@media screen and (min-width: 36em){.views,.selectall{left:2rem}}.views .btn-action:not(:last-child),.selectall .btn-action:not(:last-child){margin-right:0.25rem !important}.selectall{width:2.5rem;overflow:hidden}.selectall label{height:2.5rem}@media screen and (min-width: 36em){.selectall{width:auto;overflow:visible}}.actionbar [data-search]{display:none}:host([data-search]) .actionbar [data-search]{display:block;margin:0 0 0 1rem}:is(.actionbar,.actionbar--selected,.actionbar--search){border-top-left-radius:0.625rem;border-top-right-radius:0.625rem;padding:0 1.5rem;flex-wrap:nowrap;justify-content:flex-end;align-items:center;height:4.25rem;inset:0}@supports selector(:has(*)){:is(.actionbar,.actionbar--selected,.actionbar--search){position:absolute}}@container (width > 23.4375em){:is(.actionbar,.actionbar--selected,.actionbar--search){padding:0 2rem}}.actionbar{display:flex}.actionbar--selected{background-color:var(--colour-canvas);display:flex;pointer-events:none}@media screen and (prefers-color-scheme: light){.actionbar--selected{background-color:#e6eaec}}@supports selector(:has(*)){.actionbar--selected{opacity:0}}.actionbar--search{background-color:var(--colour-canvas);display:flex;z-index:2;position:relative;opacity:0;pointer-events:none}@media screen and (prefers-color-scheme: light){.actionbar--search{background-color:#e6eaec}}.selectall:has(input:checked)~.actionbar,.selectall:has(input:indeterminate)~.actionbar{opacity:0;pointer-events:none}.selectall:has(input:checked)~.actionbar--selected,.selectall:has(input:indeterminate)~.actionbar--selected{opacity:1;pointer-events:all}.actionbar--search.show{opacity:1;pointer-events:all}.actionbar__wrapper:has(.actionbar--search.show)>*:not(.actionbar--search.show){opacity:0;pointer-events:none}::slotted(*:not([slot=overflow])){margin-top:0 !important;margin-bottom:0 !important;margin-left:1rem !important;margin-right:0 !important}::slotted(.btn:not(.btn-action)){order:2}::slotted([data-single]){pointer-events:none;opacity:.5}:host([data-selected="1"]) ::slotted([data-single]){pointer-events:all;opacity:1}::slotted(hr){height:2rem;color:#9d9d9d !important;width:1px;display:none}@container (width > 48em){::slotted(hr){display:block}}.safe-area{display:flex;flex-wrap:nowrap;justify-content:flex-end;align-items:center;width:13.125rem;overflow:visible;position:relative}@container (width > 23.4375em){.safe-area{width:28.125rem}}@container (width > 48em){.safe-area{width:46.875rem}}.safe-area .body{display:contents}:host([data-switchviews]) .safe-area{width:9rem}::slotted(.btn-compact[slot=selected-overflow]),::slotted(.btn-compact[slot=overflow]){max-width:none !important;text-indent:0 !important;width:auto !important;text-align:left !important;padding-left:0 !important;background:none !important;border:none !important}::slotted(.btn-compact[slot=selected-overflow]):before,::slotted(.btn-compact[slot=overflow]):before{position:static !important;line-height:inherit !important}.dialog__wrapper.dialog-overflow{margin-left:.5rem;margin-right:-0.5rem}.actionbar--search .btn{margin:0;margin-left:-0.75rem !important;margin-right:auto !important}.search-wrapper{width:calc(100% - 3.25rem);max-width:21.875rem !important;margin:0 !important}@container (width > 48em){.search-wrapper{max-width:28.125rem !important}}.search-wrapper input{padding-top:0.5rem;padding-bottom:0.5rem;min-height:2.5rem !important;max-height:2.5rem !important}.search-wrapper :is(.prefix,.suffix){padding:0.5rem !important;min-height:2.5rem !important;max-height:2.5rem !important;min-width:2.5rem !important;max-width:2.5rem !important;line-height:1.5rem !important}/*# sourceMappingURL=assets/css/components/actionbar.css.map */
2701
2701
 
2702
2702
  ${this.hasAttribute("css") ? `@import "${this.getAttribute("css")}";` : ""}
2703
2703
  </style>
@@ -2714,7 +2714,7 @@ class Do extends HTMLElement {
2714
2714
  <slot name="menu"></slot>
2715
2715
  </dialog>
2716
2716
  </div>
2717
- <button class="btn btn-secondary btn-compact btn-sm fa-search m-0" data-search="">Search</button>
2717
+ <button class="btn btn-secondary btn-compact btn-sm fa-search" data-search="">Search</button>
2718
2718
  </div>
2719
2719
  </div>
2720
2720
  </div>
@@ -2902,7 +2902,7 @@ const Ai = /* @__PURE__ */ A(Fo, [["render", Io]]), Bo = (e, a) => {
2902
2902
  name: "Address Lookup",
2903
2903
  mounted() {
2904
2904
  this.$nextTick(function() {
2905
- Bo(/* @__PURE__ */ Object.assign({ "../../../assets/js/components/address-lookup/address-lookup.component.js": () => import("./address-lookup.component-91ec1e33.mjs"), "../../../assets/js/components/address-lookup/address-lookup.component.min.js": () => import("./address-lookup.component.min-f9466f04.mjs") }), "../../../assets/js/components/address-lookup/address-lookup.component.js").then((e) => {
2905
+ Bo(/* @__PURE__ */ Object.assign({ "../../../assets/js/components/address-lookup/address-lookup.component.js": () => import("./address-lookup.component-9a910361.mjs"), "../../../assets/js/components/address-lookup/address-lookup.component.min.js": () => import("./address-lookup.component.min-462972f3.mjs") }), "../../../assets/js/components/address-lookup/address-lookup.component.js").then((e) => {
2906
2906
  window.customElements.get("iam-address-lookup") || window.customElements.define("iam-address-lookup", e.default);
2907
2907
  }).catch((e) => {
2908
2908
  console.log(e.message);
@@ -2917,7 +2917,7 @@ function Vo(e, a, t, i, s, r) {
2917
2917
  }
2918
2918
  const _i = /* @__PURE__ */ A(Oo, [["render", Vo]]);
2919
2919
  /*!
2920
- * iamKey v4.1.1-beta-3
2920
+ * iamKey v4.1.1-beta-5
2921
2921
  * Copyright 2022-2023 iamproperty
2922
2922
  */
2923
2923
  window.dataLayer = window.dataLayer || [], window.dataLayer.push({ event: "customElementRegistered", element: "collapsible side menu" });