@iamproperty/components 7.0.0 → 7.1.0--beta2

package/dist/style.css

@@ -1 +1 @@
-@charset "UTF-8";.testimonial{--testimonial-padding: 1rem;--testimonial-spacing: 1rem}@media screen and (min-width: 62em){.testimonial{--testimonial-padding: 4rem;--testimonial-spacing: 2rem}}.testimonial>div:first-child{position:relative;overflow:hidden}.testimonial .circle{color:currentColor;position:absolute;top:-18rem;right:-8rem;font-size:28rem;border-width:4px}.testimonial__images{overflow:auto;scroll-snap-type:x mandatory;display:flex;-webkit-user-select:none;user-select:none;touch-action:pan-x;height:14.375rem}@media screen and (min-width: 36em){.testimonial__images{height:21.25rem}}@media screen and (min-width: 62em){.testimonial__images{min-height:100%;scroll-snap-type:y mandatory;flex-direction:column;touch-action:pan-y}}.testimonial__images img{scroll-snap-align:start;-webkit-user-select:none;user-select:none;pointer-events:none;flex-shrink:0}.testimonial .testimonial__controls{display:none}.testimonial.testimonial--multi .testimonial__controls{display:block;position:absolute;bottom:0;left:50%;transform:translate(-50%,50%)}@media screen and (min-width: 62em){.testimonial.testimonial--multi .testimonial__controls{left:auto;bottom:auto;right:0;top:50%;transform:rotate(90deg) translateY(-120%);transform-origin:center}}.testimonial h2{padding:2rem var(--testimonial-padding) 0 var(--testimonial-padding)}@media screen and (min-width: 36em){.testimonial h2{padding-top:3rem}}@media screen and (min-width: 62em){.testimonial h2{padding-top:9rem}}.testimonial__content{--display-none: none;margin:0 var(--testimonial-padding) var(--testimonial-spacing) var(--testimonial-padding);position:relative}@media screen and (min-width: 62em){.testimonial__content{--display-none: block}.testimonial__content blockquote:not(.largest){position:absolute;top:0}}.testimonial[data-show="1"] blockquote:not(:nth-child(1)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="2"] blockquote:not(:nth-child(2)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="3"] blockquote:not(:nth-child(3)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="4"] blockquote:not(:nth-child(4)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="5"] blockquote:not(:nth-child(5)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="6"] blockquote:not(:nth-child(6)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="7"] blockquote:not(:nth-child(7)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="8"] blockquote:not(:nth-child(8)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="9"] blockquote:not(:nth-child(9)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="10"] blockquote:not(:nth-child(10)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial__after{padding:1rem var(--testimonial-padding) var(--testimonial-spacing) var(--testimonial-padding)}.testimonial__images::-webkit-scrollbar{display:none}.testimonial__images{-ms-overflow-style:none;scrollbar-width:none}.timeline{--breakpoint:(100% - 62rem);--pl: clamp(0rem, var(--breakpoint) * -1000, 4rem);--line-pos: clamp(1rem, var(--breakpoint) * 1000, 50%);--circle-pos: 1rem;--line-length: 100%;--img-order: 1;position:relative;padding-top:.25rem;padding-left:var(--pl);padding-bottom:1rem;width:100%;display:flex;justify-content:space-between;flex-direction:row;flex-wrap:wrap;align-items:flex-start}.timeline__container:not(.timeline--simple) .timeline{align-items:center}@media screen and (min-width: 62em){.timeline__container:not(.timeline--simple) .timeline{--img-order: 0;--circle-pos: 50%;--line-length: 50%}}.timeline:before{content:" ";display:block;background:black;width:4px;height:100%;position:absolute;top:0;left:var(--line-pos)}.timeline:after{content:" ";display:block;background:white;width:2rem;height:2rem;margin-top:-1rem;position:absolute;top:var(--circle-pos);left:var(--line-pos);margin-left:calc(-1rem + 2px);border:4px solid black;border-radius:50%}.timeline>*{max-width:28.75rem;order:1}.timeline>img{max-width:min(100%,28.75rem);margin-bottom:2rem}.timeline:nth-child(2n)>img{order:var(--img-order)}.timeline:first-child:before{top:var(--circle-pos);height:var(--line-length)}.timeline:last-child{padding-bottom:0;margin-bottom:2rem}.timeline:last-child:before{height:var(--line-length)}.timeline:last-child>img{margin-bottom:0}.property-searchbar fieldset{position:relative}@media screen and (min-width: 62em){.property-searchbar fieldset{position:relative;padding-right:1.5rem}.property-searchbar fieldset:after{content:"";position:absolute;top:0;right:.5rem;display:block;height:100%;width:1px;background-color:var(--colour-muted);opacity:.25}}.property-searchbar .form-control__wrapper{margin-bottom:1rem}@media screen and (min-width: 62em){.property-searchbar .form-control__wrapper{margin-bottom:0}}.property-searchbar .form-label,.property-searchbar label{font-size:.875rem;text-transform:uppercase}@media screen and (min-width: 62em){.property-searchbar .row .row .form-label{display:none}.property-searchbar .form-control,.property-searchbar .form-select{padding:.5rem 1.5rem .5rem .5rem}.property-searchbar .form-select{background-position:right .5rem center}}.property-searchbar .input--locations{padding-right:5.5rem}.property-searchbar .select--miles{position:absolute;bottom:0rem;right:.5rem;width:5rem}@media screen and (min-width: 62em){.property-searchbar .select--miles{right:1.5rem}}.property-searchbar .select--miles label{display:none}.property-searchbar .select--miles select{background-color:transparent;border-color:transparent}@media screen and (min-width: 62em){.property-searchbar .property-searchbar__btn{align-items:flex-end}}.property-searchbar button{margin-top:1rem;margin-bottom:1rem}@media screen and (min-width: 62em){.property-searchbar button{margin:0;padding-left:3.5rem;padding-right:3.5rem}}.property-searchbar--hero .property-searchbar{--colour-muted: #9d9d9d;--colour-body: #595959;--colour-border: #D8D8D8;--colour-link: var(--colour-primary-theme);--colour-brand: var(--colour-primary-theme);--colour-underline: var(--colour-secondary);--colour-heading: var(--colour-primary);--colour-focus: var(--colour-primary-theme);--colour-hover: var(--colour-primary-theme);--colour-active: var(--colour-primary-theme);--colour-selected: var(--colour-info);--colour-inverted: #FCFCFC;--colour-btn: var(--colour-primary-theme);--colour-btn-bg: var(--colour-warning);--colour-btn-border: var(--colour-warning);--colour-btn-bg-hover: transparent;--colour-btn-hover: var(--colour-primary-theme);--colour-btn-secondary: var(--colour-primary-theme);--colour-btn-secondary-border: var(--colour-primary-theme);--colour-btn-secondary-bg: transparent;--colour-btn-secondary-bg-hover: var(--colour-primary-theme);--colour-btn-secondary-hover: var(--colour-inverted);--colour-canvas-2: white;--colour-btn-action-hover-bg: var(--colour-light);padding:1rem;background-color:#fff;width:100%;border-radius:.625rem;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.24);box-shadow:0 2px 4px #0000003d;position:relative}.property-searchbar--hero .property-searchbar .text-primary{color:var(--colour-primary)!important}@media screen and (min-width: 62em){.property-searchbar--hero .property-searchbar{border-radius:3rem;padding:1.5rem 2.5rem}.property-searchbar--hero .property-searchbar .form-label,.property-searchbar--hero .property-searchbar label{margin-bottom:0}.property-searchbar--hero .property-searchbar .form-control,.property-searchbar--hero .property-searchbar .form-select{margin-left:-.5rem;border:none;padding-top:.25rem;padding-bottom:.25rem}.property-searchbar--hero .property-searchbar .form-select{background-position:right 0rem center;padding-right:1rem}.property-searchbar--hero .property-searchbar .property-searchbar__btn{align-items:center}}.stepper{background:#f0f0f0;display:flex;flex-wrap:wrap;margin-bottom:2rem;border:1px solid var(--colour-canvas);overflow:hidden}@media screen and (min-width: 62em){.stepper{flex-wrap:nowrap;overflow-x:auto}}.stepper ol{margin:0;z-index:1;background:var(--colour-canvas);counter-reset:section;width:100%;overflow:auto}@media screen and (min-width: 36em){.stepper ol{display:flex;flex-grow:1;padding-right:calc(2rem + 1px);margin-top:-1px;margin-bottom:-1px;margin-right:calc(-2rem - 2px);clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%)}}@media screen and (min-width: 62em){.stepper ol{overflow:initial}}.stepper ol li{width:100%;max-width:100%;background:var(--colour-canvas);padding:1px}@media screen and (min-width: 36em){.stepper ol li:first-child a{padding-left:1rem;clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%)}}@media screen and (min-width: 62em){.stepper ol li:first-child a{padding-left:2rem}}.stepper ol li a{display:block;padding:1rem;text-decoration:none;background:var(--colour-muted);line-height:1;position:relative;color:var(--colour-primary)}@media screen and (min-width: 36em){.stepper ol li a{margin-right:-2rem;padding:2rem 3rem;clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%,2rem 50%);display:flex;height:100%;vertical-align:baseline;justify-content:center;align-items:center}}.stepper ol li a span{position:relative;display:inline;padding-left:2.25rem}.stepper ol li a span:before{counter-increment:section;content:counter(section);display:block;position:absolute;top:50%;left:0;transform:translateY(-50%);margin-right:.5rem;font-size:.75em;border-radius:50%;border:2px solid currentColor;height:1.5rem;line-height:1.3rem;width:1.5rem;font-family:var(--font-heading);text-align:center}.stepper ol li a.bg-warning span:before,.stepper ol li a.bg-danger span:before{content:"!"}.stepper ol li a.bg-success span:before{content:"✓";text-indent:-.1em}.stepper ol li a[aria-current=step]{background:var(--colour-primary);color:#fff;pointer-events:none}.stepper ol li a:not([href]){pointer-events:none}.stepper ol li a[href]:hover{opacity:.6}.stepper ol li a[href]:active{opacity:.8}.stepper>span{width:100%;display:flex;padding:1rem;flex-shrink:0;margin:0;position:relative;z-index:0;align-items:center}.stepper>span.stepper__end{display:none}@media screen and (min-width: 62em){.stepper>span{width:max-content;padding:2rem}.stepper>span.stepper__end{padding-left:3.5rem;display:flex}}.snapshot>.row{padding-bottom:1rem}.snapshot>.row>.col{margin-bottom:1rem;min-width:9.375rem;position:relative}@media screen and (min-width: 36em){.snapshot>.row>.col:nth-child(8)~.col{max-width:25%}}@media screen and (min-width: 62em){.snapshot>.row>.col:nth-child(8)~.col{max-width:12.5%}}.snapshot__item{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:100%;padding:1rem}.snapshot__item:not([class*=bg-]){border:1px solid var(--colour-border)}.snapshot a{position:absolute;top:0;left:0;height:100%;width:100%;opacity:0;z-index:1}.snapshot a:hover+.snapshot__item{opacity:.8}.snapshot__title{padding-bottom:1rem}.snapshot__title:after{content:":"}.snapshot .stat{text-decoration:none;margin-bottom:0}*:not(main):has(>iam-tabs){container-type:inline-size}iam-tabs details:not([open]){padding-bottom:0}iam-tabs::part(next-button){display:none}@container (width > 62em){iam-tabs.tabs--guided::part(next-button){position:absolute;top:9.375rem;right:0;display:block}}iam-tabs.tabs--guided::part(next-button):not(:hover){background:var(--colour-success)}.tabs:not(.admin-panel){position:relative}.tabs:not(.admin-panel) .tabs__links__wrapper{position:relative;margin:0 auto 2rem}.tabs:not(.admin-panel) .tabs__links__wrapper:after{content:"";left:50%;position:relative;height:1px;width:100vw;background-color:var(--colour-border);transform:translate(-50%);display:block;clear:both}.tabs.admin-panel .tabs__links__wrapper:after{display:none}.tabs__links{scroll-snap-type:x mandatory;-webkit-mask-image:linear-gradient(to right,rgb(0,0,0) 90%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgb(0,0,0) 90%,rgba(0,0,0,0) 100%)}.tabs__links{padding-bottom:3px;position:relative;display:flex;flex-wrap:nowrap;width:auto;margin:0 -1.5rem;overflow-y:clip;overflow-x:auto}.tabs__links::-webkit-scrollbar{display:none}.tabs__links .link{white-space:nowrap;scroll-snap-align:start;scroll-margin-left:var(--container-padding)}.tabs__links .link:not(.text-decoration-none):not(.btn){--is-current: 0;font-weight:700;font-family:var(--font-heading);font-size:1.125rem;cursor:pointer;margin:0;padding:1.5rem 1.5rem .5rem;display:inline-block}.tabs__links .link:not(.text-decoration-none):not(.btn).disabled{cursor:not-allowed;opacity:.4}.tabs__links .link:not(.text-decoration-none):not(.btn):last-child{margin-inline-end:0}.tabs__links .link:not(.text-decoration-none):not(.btn):after{position:absolute;content:"";bottom:0;left:50%;height:3px;width:100%;transform:translate(-50%) scale(0);background:var(--colour-info);transition:transform .4s}.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):hover:after,.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):focus:after,.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled).focus:after{transform:translate(-50%) scaleX(.6)}.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):is([aria-pressed=true],:active,.current):after{transform:translate(-50%) scale(1)}.tabs__links .link:not(.text-decoration-none):not(.btn):is([aria-pressed=true],.current){pointer-events:none;outline:var(--contrast-outline-width, 0px) solid var(--colour-primary-theme)!important}@media (min-width: 576px){.tabs__links .link:not(.text-decoration-none):not(.btn){padding:2rem 2rem .5rem}.tabs__links__wrapper{margin:0 auto 2.5rem}}.admin-panel :is(.admin-panel__links,.tabs__links){padding:0;margin:calc(var(--padding-top) * -1) calc(var(--padding-x) * -1) var(--padding-top) calc(var(--padding-x) * -1);border-top-left-radius:.5rem;border-top-right-radius:.5rem;display:flex;flex-direction:column;border-bottom:1px solid var(--colour-border);overflow:hidden;outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}.admin-panel :is(.admin-panel__links,.tabs__links):after{display:none}@media screen and (min-width: 36em){.admin-panel :is(.admin-panel__links,.tabs__links){flex-direction:row}}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn){margin:0;padding:1rem var(--padding-x);width:100%;position:relative;text-align:left;flex-grow:1;--gradient-direction: -90deg;background-color:var(--colour-success)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not([class*=bg-]){background-image:linear-gradient(var(--gradient-direction),var(--colour-info) 0,transparent 100%)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):is(.current,[aria-pressed=true]){color:var(--colour-primary-theme)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not(.current,[aria-pressed=true]){background:var(--colour-canvas-2)!important}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):after{display:none}@media screen and (min-width: 36em){.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn){margin:0}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not(:first-child){border-left:1px solid var(--colour-border)!important}}.admin-panel :is(.admin-panel__links,.tabs__links) .link:is(.current,[aria-pressed=true]){pointer-events:none}@media screen and (min-width: 36em){:host(.tabs--inline) .tabs__links{margin:0;justify-content:center}:host(.tabs--inline) .tabs__links__wrapper:after{width:100%}}
+@charset "UTF-8";.testimonial{--testimonial-padding: 1rem;--testimonial-spacing: 1rem}@media screen and (min-width: 62em){.testimonial{--testimonial-padding: 4rem;--testimonial-spacing: 2rem}}.testimonial>div:first-child{position:relative;overflow:hidden}.testimonial .circle{color:currentColor;position:absolute;top:-18rem;right:-8rem;font-size:28rem;border-width:4px}.testimonial__images{overflow:auto;scroll-snap-type:x mandatory;display:flex;-webkit-user-select:none;user-select:none;touch-action:pan-x;height:14.375rem}@media screen and (min-width: 36em){.testimonial__images{height:21.25rem}}@media screen and (min-width: 62em){.testimonial__images{min-height:100%;scroll-snap-type:y mandatory;flex-direction:column;touch-action:pan-y}}.testimonial__images img{scroll-snap-align:start;-webkit-user-select:none;user-select:none;pointer-events:none;flex-shrink:0}.testimonial .testimonial__controls{display:none}.testimonial.testimonial--multi .testimonial__controls{display:block;position:absolute;bottom:0;left:50%;transform:translate(-50%,50%)}@media screen and (min-width: 62em){.testimonial.testimonial--multi .testimonial__controls{left:auto;bottom:auto;right:0;top:50%;transform:rotate(90deg) translateY(-120%);transform-origin:center}}.testimonial h2{padding:2rem var(--testimonial-padding) 0 var(--testimonial-padding)}@media screen and (min-width: 36em){.testimonial h2{padding-top:3rem}}@media screen and (min-width: 62em){.testimonial h2{padding-top:9rem}}.testimonial__content{--display-none: none;margin:0 var(--testimonial-padding) var(--testimonial-spacing) var(--testimonial-padding);position:relative}@media screen and (min-width: 62em){.testimonial__content{--display-none: block}.testimonial__content blockquote:not(.largest){position:absolute;top:0}}.testimonial[data-show="1"] blockquote:not(:nth-child(1)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="2"] blockquote:not(:nth-child(2)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="3"] blockquote:not(:nth-child(3)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="4"] blockquote:not(:nth-child(4)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="5"] blockquote:not(:nth-child(5)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="6"] blockquote:not(:nth-child(6)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="7"] blockquote:not(:nth-child(7)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="8"] blockquote:not(:nth-child(8)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="9"] blockquote:not(:nth-child(9)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial[data-show="10"] blockquote:not(:nth-child(10)){display:var(--display-none);opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none}.testimonial__after{padding:1rem var(--testimonial-padding) var(--testimonial-spacing) var(--testimonial-padding)}.testimonial__images::-webkit-scrollbar{display:none}.testimonial__images{-ms-overflow-style:none;scrollbar-width:none}.timeline{--breakpoint: (100% - 62rem);--pl: clamp(0rem, var(--breakpoint) * -1000, 4rem);--line-pos: clamp(1rem, var(--breakpoint) * 1000, 50%);--circle-pos: 1rem;--line-length: 100%;--img-order: 1;position:relative;padding-top:.25rem;padding-left:var(--pl);padding-bottom:1rem;width:100%;display:flex;justify-content:space-between;flex-direction:row;flex-wrap:wrap;align-items:flex-start}.timeline__container:not(.timeline--simple) .timeline{align-items:center}@media screen and (min-width: 62em){.timeline__container:not(.timeline--simple) .timeline{--img-order: 0;--circle-pos: 50%;--line-length: 50%}}.timeline:before{content:" ";display:block;background:black;width:4px;height:100%;position:absolute;top:0;left:var(--line-pos)}.timeline:after{content:" ";display:block;background:white;width:2rem;height:2rem;margin-top:-1rem;position:absolute;top:var(--circle-pos);left:var(--line-pos);margin-left:calc(-1rem + 2px);border:4px solid black;border-radius:50%}.timeline>*{max-width:28.75rem;order:1}.timeline>img{max-width:min(100%,28.75rem);margin-bottom:2rem}.timeline:nth-child(2n)>img{order:var(--img-order)}.timeline:first-child:before{top:var(--circle-pos);height:var(--line-length)}.timeline:last-child{padding-bottom:0;margin-bottom:2rem}.timeline:last-child:before{height:var(--line-length)}.timeline:last-child>img{margin-bottom:0}.property-searchbar fieldset{position:relative}@media screen and (min-width: 62em){.property-searchbar fieldset{position:relative;padding-right:1.5rem}.property-searchbar fieldset:after{content:"";position:absolute;top:0;right:.5rem;display:block;height:100%;width:1px;background-color:var(--colour-muted);opacity:.25}}.property-searchbar .form-control__wrapper{margin-bottom:1rem}@media screen and (min-width: 62em){.property-searchbar .form-control__wrapper{margin-bottom:0}}.property-searchbar .form-label,.property-searchbar label{font-size:.875rem;text-transform:uppercase}@media screen and (min-width: 62em){.property-searchbar .row .row .form-label{display:none}.property-searchbar .form-control,.property-searchbar .form-select{padding:.5rem 1.5rem .5rem .5rem}.property-searchbar .form-select{background-position:right .5rem center}}.property-searchbar .input--locations{padding-right:5.5rem}.property-searchbar .select--miles{position:absolute;bottom:0rem;right:.5rem;width:5rem}@media screen and (min-width: 62em){.property-searchbar .select--miles{right:1.5rem}}.property-searchbar .select--miles label{display:none}.property-searchbar .select--miles select{background-color:transparent;border-color:transparent}@media screen and (min-width: 62em){.property-searchbar .property-searchbar__btn{align-items:flex-end}}.property-searchbar button{margin-top:1rem;margin-bottom:1rem}@media screen and (min-width: 62em){.property-searchbar button{margin:0;padding-left:3.5rem;padding-right:3.5rem}}.property-searchbar--hero .property-searchbar{--colour-muted: #9d9d9d;--colour-body: #595959;--colour-border: #d8d8d8;--colour-link: var(--colour-primary-theme);--colour-brand: var(--colour-primary-theme);--colour-underline: var(--colour-secondary);--colour-heading: var(--colour-primary);--colour-focus: var(--colour-primary-theme);--colour-hover: var(--colour-primary-theme);--colour-active: var(--colour-primary-theme);--colour-selected: var(--colour-info);--colour-inverted: #fcfcfc;--colour-btn: var(--colour-primary-theme);--colour-btn-bg: var(--colour-warning);--colour-btn-border: var(--colour-warning);--colour-btn-bg-hover: transparent;--colour-btn-hover: var(--colour-primary-theme);--colour-btn-secondary: var(--colour-primary-theme);--colour-btn-secondary-border: var(--colour-primary-theme);--colour-btn-secondary-bg: transparent;--colour-btn-secondary-bg-hover: var(--colour-primary-theme);--colour-btn-secondary-hover: var(--colour-inverted);--colour-canvas-2: white;--colour-btn-action-hover-bg: var(--colour-light);padding:1rem;background-color:#fff;width:100%;border-radius:.625rem;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.24);box-shadow:0 2px 4px #0000003d;position:relative}.property-searchbar--hero .property-searchbar .text-primary{color:var(--colour-primary)!important}@media screen and (min-width: 62em){.property-searchbar--hero .property-searchbar{border-radius:3rem;padding:1.5rem 2.5rem}.property-searchbar--hero .property-searchbar .form-label,.property-searchbar--hero .property-searchbar label{margin-bottom:0}.property-searchbar--hero .property-searchbar .form-control,.property-searchbar--hero .property-searchbar .form-select{margin-left:-.5rem;border:none;padding-top:.25rem;padding-bottom:.25rem}.property-searchbar--hero .property-searchbar .form-select{background-position:right 0rem center;padding-right:1rem}.property-searchbar--hero .property-searchbar .property-searchbar__btn{align-items:center}}.stepper{background:#f0f0f0;display:flex;flex-wrap:wrap;margin-bottom:2rem;border:1px solid var(--colour-canvas);overflow:hidden}@media screen and (min-width: 62em){.stepper{flex-wrap:nowrap;overflow-x:auto}}.stepper ol{margin:0;z-index:1;background:var(--colour-canvas);counter-reset:section;width:100%;overflow:auto}@media screen and (min-width: 36em){.stepper ol{display:flex;flex-grow:1;padding-right:calc(2rem + 1px);margin-top:-1px;margin-bottom:-1px;margin-right:calc(-2rem - 2px);clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%)}}@media screen and (min-width: 62em){.stepper ol{overflow:initial}}.stepper ol li{width:100%;max-width:100%;background:var(--colour-canvas);padding:1px}@media screen and (min-width: 36em){.stepper ol li:first-child a{padding-left:1rem;clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%)}}@media screen and (min-width: 62em){.stepper ol li:first-child a{padding-left:2rem}}.stepper ol li a{display:block;padding:1rem;text-decoration:none;background:var(--colour-muted);line-height:1;position:relative;color:var(--colour-primary)}@media screen and (min-width: 36em){.stepper ol li a{margin-right:-2rem;padding:2rem 3rem;clip-path:polygon(0 0,calc(100% - 2rem) 0,100% 50%,calc(100% - 2rem) 100%,0 100%,2rem 50%);display:flex;height:100%;vertical-align:baseline;justify-content:center;align-items:center}}.stepper ol li a span{position:relative;display:inline;padding-left:2.25rem}.stepper ol li a span:before{counter-increment:section;content:counter(section);display:block;position:absolute;top:50%;left:0;transform:translateY(-50%);margin-right:.5rem;font-size:.75em;border-radius:50%;border:2px solid currentColor;height:1.5rem;line-height:1.3rem;width:1.5rem;font-family:var(--font-heading);text-align:center}.stepper ol li a.bg-warning span:before,.stepper ol li a.bg-danger span:before{content:"!"}.stepper ol li a.bg-success span:before{content:"✓";text-indent:-.1em}.stepper ol li a[aria-current=step]{background:var(--colour-primary);color:#fff;pointer-events:none}.stepper ol li a:not([href]){pointer-events:none}.stepper ol li a[href]:hover{opacity:.6}.stepper ol li a[href]:active{opacity:.8}.stepper>span{width:100%;display:flex;padding:1rem;flex-shrink:0;margin:0;position:relative;z-index:0;align-items:center}.stepper>span.stepper__end{display:none}@media screen and (min-width: 62em){.stepper>span{width:max-content;padding:2rem}.stepper>span.stepper__end{padding-left:3.5rem;display:flex}}.snapshot>.row{padding-bottom:1rem}.snapshot>.row>.col{margin-bottom:1rem;min-width:9.375rem;position:relative}@media screen and (min-width: 36em){.snapshot>.row>.col:nth-child(8)~.col{max-width:25%}}@media screen and (min-width: 62em){.snapshot>.row>.col:nth-child(8)~.col{max-width:12.5%}}.snapshot__item{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:100%;padding:1rem}.snapshot__item:not([class*=bg-]){border:1px solid var(--colour-border)}.snapshot a{position:absolute;top:0;left:0;height:100%;width:100%;opacity:0;z-index:1}.snapshot a:hover+.snapshot__item{opacity:.8}.snapshot__title{padding-bottom:1rem}.snapshot__title:after{content:":"}.snapshot .stat{text-decoration:none;margin-bottom:0}*:not(main):has(>iam-tabs){container-type:inline-size}iam-tabs details:not([open]){padding-bottom:0}iam-tabs::part(next-button){display:none}@container (width > 62em){iam-tabs.tabs--guided::part(next-button){position:absolute;top:9.375rem;right:0;display:block}}iam-tabs.tabs--guided::part(next-button):not(:hover){background:var(--colour-success)}.tabs:not(.admin-panel){position:relative}.tabs:not(.admin-panel) .tabs__links__wrapper{position:relative;margin:0 auto 2rem}.tabs:not(.admin-panel) .tabs__links__wrapper:after{content:"";left:50%;position:relative;height:1px;width:100vw;background-color:var(--colour-border);transform:translate(-50%);display:block;clear:both}.tabs.admin-panel .tabs__links__wrapper:after{display:none}.tabs__links{scroll-snap-type:x mandatory;-webkit-mask-image:linear-gradient(to right,rgb(0,0,0) 90%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgb(0,0,0) 90%,rgba(0,0,0,0) 100%)}.tabs__links{padding-bottom:3px;position:relative;display:flex;flex-wrap:nowrap;width:auto;margin:0 -1.5rem;overflow-y:clip;overflow-x:auto}.tabs__links::-webkit-scrollbar{display:none}.tabs__links .link{white-space:nowrap;scroll-snap-align:start;scroll-margin-left:var(--container-padding)}.tabs__links .link:not(.text-decoration-none):not(.btn){--is-current: 0;font-weight:700;font-family:var(--font-heading);font-size:1.125rem;cursor:pointer;margin:0;padding:1.5rem 1.5rem .5rem;display:inline-block}.tabs__links .link:not(.text-decoration-none):not(.btn).disabled{cursor:not-allowed;opacity:.4}.tabs__links .link:not(.text-decoration-none):not(.btn):last-child{margin-inline-end:0}.tabs__links .link:not(.text-decoration-none):not(.btn):after{position:absolute;content:"";bottom:0;left:50%;height:3px;width:100%;transform:translate(-50%) scale(0);background:var(--colour-info);transition:transform .4s}.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):hover:after,.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):focus:after,.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled).focus:after{transform:translate(-50%) scaleX(.6)}.tabs__links .link:not(.text-decoration-none):not(.btn):not(.disabled):is([aria-pressed=true],:active,.current):after{transform:translate(-50%) scale(1)}.tabs__links .link:not(.text-decoration-none):not(.btn):is([aria-pressed=true],.current){pointer-events:none;outline:var(--contrast-outline-width, 0px) solid var(--colour-primary-theme)!important}@media (min-width: 576px){.tabs__links .link:not(.text-decoration-none):not(.btn){padding:2rem 2rem .5rem}.tabs__links__wrapper{margin:0 auto 2.5rem}}.admin-panel :is(.admin-panel__links,.tabs__links){padding:0;margin:calc(var(--padding-top) * -1) calc(var(--padding-x) * -1) var(--padding-top) calc(var(--padding-x) * -1);border-top-left-radius:.5rem;border-top-right-radius:.5rem;display:flex;flex-direction:column;border-bottom:1px solid var(--colour-border);overflow:hidden;outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}.admin-panel :is(.admin-panel__links,.tabs__links):after{display:none}@media screen and (min-width: 36em){.admin-panel :is(.admin-panel__links,.tabs__links){flex-direction:row}}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn){margin:0;padding:1rem var(--padding-x);width:100%;position:relative;text-align:left;flex-grow:1;--gradient-direction: -90deg;background-color:var(--colour-success)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not([class*=bg-]){background-image:linear-gradient(var(--gradient-direction),var(--colour-info) 0,transparent 100%)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):is(.current,[aria-pressed=true]){color:var(--colour-primary-theme)}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not(.current,[aria-pressed=true]){background:var(--colour-canvas-2)!important}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):after{display:none}@media screen and (min-width: 36em){.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn){margin:0}.admin-panel :is(.admin-panel__links,.tabs__links) .link:not(.text-decoration-none):not(.btn):not(:first-child){border-left:1px solid var(--colour-border)!important}}.admin-panel :is(.admin-panel__links,.tabs__links) .link:is(.current,[aria-pressed=true]){pointer-events:none}@media screen and (min-width: 36em){:host(.tabs--inline) .tabs__links{margin:0;justify-content:center}:host(.tabs--inline) .tabs__links__wrapper:after{width:100%}}

package/package.json

@@ -5,7 +5,7 @@
     "name": "iamproperty"
   },
   "private": false,
-  "version": "7.0.0",
+  "version": "7.1.0--beta2",
   "scripts": {
     "temp": "rollup --environment COMPONENT:carousel --config rollup-component.config.js --sourcemap",
     "bootstrap": "copyfiles -u 2 node_modules/bootstrap/**/* assets/bootstrap",
@@ -40,11 +40,22 @@
     "pull-request": "npm run test && npm run compile && npm run audit",
     "deploy:fonts": "copyfiles -u 2 assets/fonts/**/* public/assets/fonts",
     "deploy:svg": "copyfiles -u 2 assets/svg/icons.svg public/svg && copyfiles -u 2 assets/svg/logo.svg public/svg",
-    "deploy:404": "node local_modules/create404.js"
+    "deploy:404": "node local_modules/create404.js",
+    "lint": "eslint assets/ts/scripts.ts assets/ts/components.ts assets/ts/components/**/*.ts assets/ts/modules/**/*.ts",
+    "lint:fix": "eslint assets/ts/scripts.ts assets/ts/components.ts assets/ts/components/**/*.ts assets/ts/modules/**/*.ts --fix",
+    "prettier": "prettier assets/ts assets/sass src docs --write"
   },
   "dependencies": {
+    "@eslint/js": "^9.17.0",
     "bootstrap": "^5.2.0",
-    "js-cookie": "^3.0.5"
+    "eslint": "^9.19.0",
+    "eslint-config-prettier": "^10.0.1",
+    "eslint-config-prettier-vue": "^1.0.0",
+    "eslint-plugin-vue": "^9.32.0",
+    "globals": "^15.14.0",
+    "js-cookie": "^3.0.5",
+    "prettier": "^3.4.2",
+    "typescript-eslint": "^8.19.1"
   },
   "devDependencies": {
     "@babel/cli": "^7.21.0",
@@ -95,7 +106,6 @@
     "vite": "^4.5.3",
     "vite-plugin-vue-markdown": "^0.22.6",
     "vue": "^3.2.47",
-    "vue-jest": "^3.0.7",
     "vue-router": "^4.1.6",
     "vue-tsc": "^2.1.10"
   },

package/src/components/Accordion/Accordion.spec.js

@@ -1,17 +1,15 @@
-import { mount } from '@vue/test-utils'
-import Accordion from './Accordion.vue'
-import AccordionItem from './AccordionItem.vue'
+import { mount } from '@vue/test-utils';
+import Accordion from './Accordion.vue';
+import AccordionItem from './AccordionItem.vue';
 
 describe('Accordion component', () => {
   it('renders two details', () => {
-
     const test = mount(Accordion, {
-      propsData: {
-      },
+      propsData: {},
       global: {
         stubs: {
-          'AccordionItem': AccordionItem
-        }
+          AccordionItem: AccordionItem,
+        },
       },
       slots: {
         default: `<AccordionItem title="How long does the auction last?" open>
@@ -19,23 +17,20 @@ describe('Accordion component', () => {
       </AccordionItem>
       <AccordionItem title="Curabitur aliquet quam id dui posuere blandit. Vivamus suscipit tortor eget felis porttitor volutpat?">
         <p>Curabitur aliquet quam id dui posuere blandit. Vivamus suscipit tortor eget felis porttitor volutpat. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Proin eget tortor risus. Vivamus suscipit tortor eget felis porttitor volutpat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus.</p><p>Nulla porttitor accumsan tincidunt. Cras ultricies ligula sed magna dictum porta. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Vivamus suscipit tortor eget felis porttitor volutpat. Vivamus suscipit tortor eget felis porttitor volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Vivamus suscipit tortor eget felis porttitor volutpat.</p><p>Donec rutrum congue leo eget malesuada. Pellentesque in ipsum id orci porta dapibus. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Nulla quis lorem ut libero malesuada feugiat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Pellentesque in ipsum id orci porta dapibus. Pellentesque in ipsum id orci porta dapibus.</p>
-      </AccordionItem>`
-      }
-    })
-
-    expect(test.findAll('details').length).toBe(2)
-  })
+      </AccordionItem>`,
+      },
+    });
 
+    expect(test.findAll('details').length).toBe(2);
+  });
 
   it('closes the other items when one opens', async () => {
     const test = mount(Accordion, {
-      propsData: {
-
-      },
+      propsData: {},
       global: {
         stubs: {
-          'AccordionItem': AccordionItem
-        }
+          AccordionItem: AccordionItem,
+        },
       },
       slots: {
         default: `<AccordionItem title="How long does the auction last?" open>
@@ -43,21 +38,20 @@ describe('Accordion component', () => {
       </AccordionItem>
       <AccordionItem title="Curabitur aliquet quam id dui posuere blandit. Vivamus suscipit tortor eget felis porttitor volutpat?">
         <p>Curabitur aliquet quam id dui posuere blandit. Vivamus suscipit tortor eget felis porttitor volutpat. Proin eget tortor risus. Proin eget tortor risus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Proin eget tortor risus. Vivamus suscipit tortor eget felis porttitor volutpat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus.</p><p>Nulla porttitor accumsan tincidunt. Cras ultricies ligula sed magna dictum porta. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Vivamus suscipit tortor eget felis porttitor volutpat. Vivamus suscipit tortor eget felis porttitor volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Vivamus suscipit tortor eget felis porttitor volutpat.</p><p>Donec rutrum congue leo eget malesuada. Pellentesque in ipsum id orci porta dapibus. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Nulla quis lorem ut libero malesuada feugiat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Pellentesque in ipsum id orci porta dapibus. Pellentesque in ipsum id orci porta dapibus.</p>
-      </AccordionItem>`
-      }
-    })
+      </AccordionItem>`,
+      },
+    });
 
-    const details = test.findAll('details')
+    const details = test.findAll('details');
 
-    const firstDetail = details.at(0)
-    const secondDetail = details.at(1)
+    const firstDetail = details.at(0);
+    const secondDetail = details.at(1);
     const detailButton = secondDetail?.find('summary');
 
-    expect(firstDetail.attributes('open')).toBe('')
-
-    await detailButton.trigger('click')
+    expect(firstDetail.attributes('open')).toBe('');
 
-    expect(firstDetail.attributes('open')).toBe(undefined || "")
-  })
+    await detailButton.trigger('click');
 
-})
+    expect(firstDetail.attributes('open')).toBe(undefined || '');
+  });
+});

package/src/components/Accordion/Accordion.vue

@@ -5,27 +5,24 @@
 </template>
 
 <style lang="scss">
-//@import "../../../assets/sass/components/accordion.scss";
+  //@import "../../../assets/sass/components/accordion.scss";
 </style>
 
 <script>
-export default {
-  name: 'Accordion',
-  props: {
-  },
-  mounted(){
-
-    this.$nextTick(function () {
-      
-      import(`../../../assets/js/components/accordion/accordion.component.min.js`).then(module => {
-
-        if (!window.customElements.get(`iam-accordion`))
-          window.customElements.define(`iam-accordion`, module.default);
-
-      }).catch((err) => {
-        console.log(err.message);
+  export default {
+    name: 'Accordion',
+    props: {},
+    mounted() {
+      this.$nextTick(function () {
+        import(`../../../assets/js/components/accordion/accordion.component.min.js`)
+          .then((module) => {
+            if (!window.customElements.get(`iam-accordion`))
+              window.customElements.define(`iam-accordion`, module.default);
+          })
+          .catch((err) => {
+            console.log(err.message);
+          });
       });
-    })
-  }
-}
+    },
+  };
 </script>

package/src/components/Accordion/AccordionItem.vue

@@ -1,49 +1,51 @@
 <template>
   <details :id="createID(title)">
-    <summary>{{title}}<span v-if="badge" :class="`badge bg-${badgecolour}`">{{badge}}</span></summary>
+    <summary>
+      {{ title }}<span v-if="badge" :class="`badge bg-${badgecolour}`">{{ badge }}</span>
+    </summary>
     <slot></slot>
   </details>
 </template>
 
 <script>
-import { safeID } from '../../helpers/strings.js'
+  import { safeID } from '../../helpers/strings.js';
 
-export default {
-  name: 'AccordionItem',
-  props: {
-    title: {
-      type: String,
-      required: true
+  export default {
+    name: 'AccordionItem',
+    props: {
+      title: {
+        type: String,
+        required: true,
+      },
+      titlecolour: {
+        type: String,
+        required: false,
+      },
+      badge: {
+        type: [Number, String],
+        required: false,
+      },
+      badgecolour: {
+        type: String,
+        required: false,
+        default: 'light',
+      },
+      lazy: {
+        type: Boolean,
+        required: false,
+      },
     },
-    titlecolour: {
-      type: String,
-      required: false
+    computed: {
+      createID() {
+        return (summary) => {
+          return `${safeID(summary)}`;
+        };
+      },
     },
-    badge: {
-      type: [Number, String],
-      required: false
+    data() {
+      return {
+        show: this.lazy ? false : true,
+      };
     },
-    badgecolour: {
-      type: String,
-      required: false,
-      default: 'light'
-    },
-    lazy: {
-      type: Boolean,
-      required: false
-    }
-  },
-  computed: {
-    createID () {
-      return (summary) => {
-        return `${safeID(summary)}`
-      }
-    }
-  },
-  data() {
-    return {
-      show: this.lazy ? false : true
-    }
-  }
-}
+  };
 </script>

package/src/components/Accordion/README.md

@@ -14,20 +14,18 @@
 - Adding a class of **.accordion--keep-open** to the accordion will stop the items from closing when another one is opened.
 - Adding a class of **.accordion--straight** to the accordion will remove the slight indentation of the accordion.
 
-
 ### Accordion item Properties
 
-| Option | Type | Default Value | Description |
-| ------ | ---- | ------------- | ----------- |
-| title | String | - | A question or statement |
-| titlecolour | String | - | Apply a colour the the accordion item title |
-| badge | String | - | Add a highlighted badge/tag to the accordion item title |
-| badgecolour | String | light | Apply a colour the badge |
-| lazy  | Boolean | - | If set the content of the tab will not loaded intially and will be loaded after the user has clicked on the accordion link. |
-
+| Option      | Type    | Default Value | Description                                                                                                                 |
+| ----------- | ------- | ------------- | --------------------------------------------------------------------------------------------------------------------------- |
+| title       | String  | -             | A question or statement                                                                                                     |
+| titlecolour | String  | -             | Apply a colour the the accordion item title                                                                                 |
+| badge       | String  | -             | Add a highlighted badge/tag to the accordion item title                                                                     |
+| badgecolour | String  | light         | Apply a colour the badge                                                                                                    |
+| lazy        | Boolean | -             | If set the content of the tab will not loaded intially and will be loaded after the user has clicked on the accordion link. |
 
 ### Accordion item Slots
 
-| Option | Default Value | Description |
-| ------ | ------------- | ----------- |
-| default | - | This is the content of the accordion item |
+| Option  | Default Value | Description                               |
+| ------- | ------------- | ----------------------------------------- |
+| default | -             | This is the content of the accordion item |

package/src/components/Actionbar/Actionbar.vue

@@ -5,23 +5,20 @@
 </template>
 
 <script>
-export default {
-  name: 'Actionbar',
-  props: {
-  },
-  mounted(){
-
-    this.$nextTick(function () {
-      
-      import(`../../../assets/js/components/actionbar/actionbar.component.min.js`).then(module => {
-
-        if (!window.customElements.get(`iam-actionbar`))
-          window.customElements.define(`iam-actionbar`, module.default);
-
-      }).catch((err) => {
-        console.log(err.message);
+  export default {
+    name: 'Actionbar',
+    props: {},
+    mounted() {
+      this.$nextTick(function () {
+        import(`../../../assets/js/components/actionbar/actionbar.component.min.js`)
+          .then((module) => {
+            if (!window.customElements.get(`iam-actionbar`))
+              window.customElements.define(`iam-actionbar`, module.default);
+          })
+          .catch((err) => {
+            console.log(err.message);
+          });
       });
-    })
-  }
-}
+    },
+  };
 </script>

package/src/components/Actionbar/README.md

@@ -1,6 +1,6 @@
 ```
 <Actionbar data-selectall data-search>
-  
+
   <div class="dialog__wrapper">
     <button class="btn btn-action mb-0 me-0">Quick filter</button>
     <dialog class="dialog--list">
@@ -30,11 +30,12 @@
 
 </Actionbar>
 ```
+
 **Properties**
 
-| Option | Type | Default Value | Description |
-| ------ | ---- | ------------- | ----------- |
-| data-selectall | - | - | Optional flag to include the select all button |
-| data-search | - | - | Optional flag to include the search button and functionality |
-| data-switchviews | - | - | Optional flag to include the switch views buttons |
-| data-view | String | square | Required if you have the above flag set. Can be set to wither 'square','list' or 'small'. |
+| Option           | Type   | Default Value | Description                                                                               |
+| ---------------- | ------ | ------------- | ----------------------------------------------------------------------------------------- |
+| data-selectall   | -      | -             | Optional flag to include the select all button                                            |
+| data-search      | -      | -             | Optional flag to include the search button and functionality                              |
+| data-switchviews | -      | -             | Optional flag to include the switch views buttons                                         |
+| data-view        | String | square        | Required if you have the above flag set. Can be set to wither 'square','list' or 'small'. |

package/src/components/AddressLookup/AddressLookup.vue

@@ -5,21 +5,19 @@
 </template>
 
 <script>
-export default {
-  name: 'Address Lookup',
-  mounted(){
-
-    this.$nextTick(function () {
-
-      import(`../../../assets/js/components/address-lookup/address-lookup.component.min.js`).then(module => {
-        
-        if (!window.customElements.get(`iam-address-lookup`))
-          window.customElements.define(`iam-address-lookup`, module.default);
-
-      }).catch((err) => {
-        console.log(err.message);
+  export default {
+    name: 'Address Lookup',
+    mounted() {
+      this.$nextTick(function () {
+        import(`../../../assets/js/components/address-lookup/address-lookup.component.min.js`)
+          .then((module) => {
+            if (!window.customElements.get(`iam-address-lookup`))
+              window.customElements.define(`iam-address-lookup`, module.default);
+          })
+          .catch((err) => {
+            console.log(err.message);
+          });
       });
-    })
-  }
-}
+    },
+  };
 </script>

package/src/components/AppliedFilters/AppliedFilters.vue

@@ -6,21 +6,19 @@
 </template>
 
 <script>
-export default {
-  name: 'Applied Filter',
-  mounted(){
-
-    this.$nextTick(function () {
-
-      import(`../../../assets/js/components/applied-filters/applied-filters.component.js`).then(module => {
-        
-        if (!window.customElements.get(`iam-applied-filters`))
-          window.customElements.define(`iam-applied-filters`, module.default);
-
-      }).catch((err) => {
-        console.log(err.message);
+  export default {
+    name: 'Applied Filter',
+    mounted() {
+      this.$nextTick(function () {
+        import(`../../../assets/js/components/applied-filters/applied-filters.component.js`)
+          .then((module) => {
+            if (!window.customElements.get(`iam-applied-filters`))
+              window.customElements.define(`iam-applied-filters`, module.default);
+          })
+          .catch((err) => {
+            console.log(err.message);
+          });
       });
-    })
-  }
-}
+    },
+  };
 </script>

package/src/components/Banner/Banner.spec.js

@@ -1,28 +1,26 @@
-import { shallowMount } from '@vue/test-utils'
-import Header from './Banner.vue'
+import { shallowMount } from '@vue/test-utils';
+import Header from './Banner.vue';
 
 describe('Banner component', () => {
-
   const test = shallowMount(Header, {
     propsData: {
       title: 'Banner title',
-      image: '/img/src/img.png'
+      image: '/img/src/img.png',
     },
     slots: {
-      default: '<p>Hello</p>'
-    }
-  })
+      default: '<p>Hello</p>',
+    },
+  });
 
   it('renders the banner title', () => {
-    expect(test.html()).toContain('<h2>Banner title</h2>')
-  })
+    expect(test.html()).toContain('<h2>Banner title</h2>');
+  });
 
   it('renders the banner content', () => {
-    expect(test.html()).toContain('<p>Hello</p>')
-  })
-
+    expect(test.html()).toContain('<p>Hello</p>');
+  });
 
   it('renders the image', () => {
-    expect(test.html()).toContain('<img src="/img/src/img.png" alt="" class="h-100 w-100 object-cover">')
-  })
-})
+    expect(test.html()).toContain('<img src="/img/src/img.png" alt="" class="h-100 w-100 object-cover">');
+  });
+});

package/src/components/Banner/Banner.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="container">
-    <div :class="'bg-'+background+' mb-4'">
+    <div :class="'bg-' + background + ' mb-4'">
       <div class="row">
         <div class="col-sm-6">
           <div class="pt-5 pb-3 px-4">
-            <h2>{{title}}</h2>
+            <h2>{{ title }}</h2>
             <slot></slot>
           </div>
         </div>
@@ -17,22 +17,22 @@
 </template>
 
 <script>
-export default {
-  name: 'Header',
-  props: {
-    title: {
-      type: String,
-      required: true
+  export default {
+    name: 'Header',
+    props: {
+      title: {
+        type: String,
+        required: true,
+      },
+      image: {
+        type: String,
+        required: false,
+      },
+      background: {
+        type: String,
+        default: 'light',
+        required: false,
+      },
     },
-    image: {
-      type: String,
-      required: false
-    },
-    background: {
-      type: String,
-      default: 'light',
-      required: false
-    }
-  }
-}
+  };
 </script>

package/src/components/Banner/README.md

@@ -9,16 +9,14 @@
 
 ### Properties
 
-| Option | Type | Default Value | Description |
-| ------ | ---- | ------------- | ----------- |
-| title | String | - | Required |
-| image | String | - | Optional image url to display in the background |
-| background | String | light | The background colour can be overwritten if need be |
-
-
+| Option     | Type   | Default Value | Description                                         |
+| ---------- | ------ | ------------- | --------------------------------------------------- |
+| title      | String | -             | Required                                            |
+| image      | String | -             | Optional image url to display in the background     |
+| background | String | light         | The background colour can be overwritten if need be |
 
 ### Slots
 
-| Option | Default Value | Description |
-| ------ | ------------- | ----------- |
-| default | - | Will display underneath the heading |
+| Option  | Default Value | Description                         |
+| ------- | ------------- | ----------------------------------- |
+| default | -             | Will display underneath the heading |