npm - @biggive/components - Versions diffs - 202401301136.0.0 → 202401301139.0.0 - Mend

@biggive/components 202401301136.0.0 → 202401301139.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (313) hide show

package/dist/collection/components/biggive-timeline/biggive-timeline.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biggive-timeline.js","sourceRoot":"","sources":["../../../src/components/biggive-timeline/biggive-timeline.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-timeline',\n styleUrl: 'biggive-timeline.scss',\n shadow: true,\n})\nexport class BiggiveTimeline {\n @Element() host: HTMLBiggiveTimelineElement;\n\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() selectedTextColour: brandColour = 'primary';\n\n @Prop() navigationHighlightColour: brandColour = 'grey-medium';\n\n @Prop() selectedNavigationHighlightColour: brandColour = 'primary';\n\n @Prop() buttonBackgroundColour: brandColour = 'white';\n\n @Prop() buttonIconColour: brandColour = 'primary';\n\n @Prop() entryBackgroundColour: brandColour = 'white';\n\n @Prop() entryHighlightColour: brandColour = 'secondary';\n\n @Prop() entryDateColour: brandColour = 'black';\n\n @Prop() entryTitleColour: brandColour = 'primary';\n\n @Prop() entryTextColour: brandColour = 'black';\n\n private scrollContextTab: HTMLElement \| null;\n private scrollOffset: number = 0;\n private tabHeadings: Array<string> = [];\n private children: Array<HTMLBiggiveTimelineEntryElement> = [];\n\n componentWillLoad() {\n this.children = Array.from(this.host.children) as Array<HTMLBiggiveTimelineEntryElement>;\n\n let tabHeadings = this.tabHeadings;\n\n this.children.forEach(function (entry) {\n let tab = entry.date.substring(0, 4);\n if (!tabHeadings.includes(tab)) {\n tabHeadings.push(tab);\n }\n });\n }\n\n componentDidRender() {\n this.showTab(0);\n }\n\n /\n Shows the i'th element in the timeline, counting from zero. Does nothing if i out of range.\n */\n private showTab(i: number) {\n const tabs = this.host.shadowRoot?.querySelectorAll<HTMLElement>('.navigation ul li')!;\n const entries = this.host.shadowRoot?.querySelectorAll<HTMLElement>('.entry')!;\n\n if (tabs.length > 0) {\n this.scrollContextTab = this.host.shadowRoot?.querySelector<HTMLElement>('.navigation ul li')!;\n }\n\n if (i >= 0 && i <= tabs?.length - 1) {\n let currentTabTitle = tabs[i]?.innerHTML;\n let j = 0;\n tabs?.forEach(function (tab) {\n if (i == j) {\n tab.classList.add('selected');\n } else {\n tab.classList.remove('selected');\n }\n j++;\n });\n\n entries.forEach(function (entry) {\n entry.style.display = entry.getAttribute('data-date')?.substring(0, 4) == currentTabTitle ? 'block' : 'none';\n });\n }\n }\n\n private clickTabHandler = (e: any) => {\n let i = 0;\n for (let el of e.target.parentElement.children) {\n if (el == e.target) {\n this.showTab(i);\n return;\n }\n i++;\n }\n };\n\n private scrollTab(direction: 'NEXT' \| 'PREV') {\n if (!this.scrollContextTab) {\n return;\n }\n\n let sleeve: HTMLElement = this.scrollContextTab.parentElement!;\n let max = sleeve.scrollWidth - sleeve.parentElement?.offsetWidth!;\n\n if (direction == 'PREV') {\n if (this.scrollOffset + this.scrollContextTab.offsetWidth > 0) {\n return;\n }\n\n this.scrollOffset = this.scrollOffset + this.scrollContextTab.offsetWidth;\n if (this.scrollContextTab.previousElementSibling) {\n this.scrollContextTab = this.scrollContextTab.previousElementSibling as HTMLElement;\n }\n } else if (direction == 'NEXT') {\n if (0 - this.scrollOffset > max) {\n return;\n }\n\n this.scrollOffset = this.scrollOffset - this.scrollContextTab.offsetWidth;\n if (this.scrollContextTab.nextElementSibling) {\n this.scrollContextTab = this.scrollContextTab.nextElementSibling as HTMLElement;\n }\n }\n\n sleeve.querySelectorAll('li').forEach(li => {\n li.style.transitionDuration = '0.3s';\n li.style.transitionTimingFunction = 'ease-out';\n li.style.transform = 'translate3d(' + this.scrollOffset + 'px, 0, 0)';\n });\n }\n\n private clickPrevHandler = () => {\n this.scrollTab('PREV');\n };\n\n private clickNextHandler = () => {\n this.scrollTab('NEXT');\n };\n\n render() {\n return (\n <div\n class={\n 'container space-below-' +\n this.spaceBelow +\n ' text-colour-' +\n this.textColour +\n ' selected-text-colour-' +\n this.selectedTextColour +\n ' navigation-highlight-colour-' +\n this.navigationHighlightColour +\n ' selected-navigation-highlight-colour-' +\n this.selectedNavigationHighlightColour +\n ' button-background-colour-' +\n this.buttonBackgroundColour +\n ' button-icon-colour-' +\n this.buttonIconColour +\n ' entry-background-colour-' +\n this.entryBackgroundColour +\n ' entry-highlight-colour-' +\n this.entryHighlightColour +\n ' entry-date-colour-' +\n this.entryDateColour +\n ' entry-title-colour-' +\n this.entryTitleColour +\n ' entry-text-colour-' +\n this.entryTextColour\n }\n >\n <div class=\"navigation\">\n <div class=\"button prev\" onClick={this.clickPrevHandler} title=\"Previous\">\n <svg width=\"9\" height=\"16\" viewBox=\"0 0 9 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8.29311 14.5703L1.73926 8.01646L8.29311 1.46261\" stroke=\"#000000\" stroke-width=\"2\" />\n </svg>\n </div>\n <div class=\"sleeve\">\n <ul>\n {this.tabHeadings.map(tab => (\n <li onClick={this.clickTabHandler}>{tab}</li>\n ))}\n </ul>\n </div>\n <div class=\"button next\" onClick={this.clickNextHandler} title=\"Next\">\n <svg width=\"9\" height=\"16\" viewBox=\"0 0 9 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M0.739117 1.46094L7.29297 8.01479L0.739118 14.5686\" stroke=\"#000000\" stroke-width=\"2\" />\n </svg>\n </div>\n </div>\n <div class=\"entry-wrap\">\n {this.children.map(entry => (\n <div class=\"entry\" data-date={entry.date}>\n <h4 class=\"title\">{entry.heading}</h4>\n <div class=\"content\" innerHTML={entry.innerHTML}></div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"biggive-timeline.js","sourceRoot":"","sources":["../../../src/components/biggive-timeline/biggive-timeline.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-timeline',\n styleUrl: 'biggive-timeline.scss',\n shadow: true,\n})\nexport class BiggiveTimeline {\n @Element() host: HTMLBiggiveTimelineElement;\n\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() selectedTextColour: brandColour = 'primary';\n\n @Prop() navigationHighlightColour: brandColour = 'grey-medium';\n\n @Prop() selectedNavigationHighlightColour: brandColour = 'primary';\n\n @Prop() buttonBackgroundColour: brandColour = 'white';\n\n @Prop() buttonIconColour: brandColour = 'primary';\n\n @Prop() entryBackgroundColour: brandColour = 'white';\n\n @Prop() entryHighlightColour: brandColour = 'secondary';\n\n @Prop() entryDateColour: brandColour = 'black';\n\n @Prop() entryTitleColour: brandColour = 'primary';\n\n @Prop() entryTextColour: brandColour = 'black';\n\n private scrollContextTab: HTMLElement \| null;\n private scrollOffset: number = 0;\n private tabHeadings: Array<string> = [];\n private children: Array<HTMLBiggiveTimelineEntryElement> = [];\n\n componentWillLoad() {\n this.children = Array.from(this.host.children) as Array<HTMLBiggiveTimelineEntryElement>;\n\n let tabHeadings = this.tabHeadings;\n\n this.children.forEach(function (entry) {\n let tab = entry.date.substring(0, 4);\n if (!tabHeadings.includes(tab)) {\n tabHeadings.push(tab);\n }\n });\n }\n\n componentDidRender() {\n this.showTab(0);\n }\n\n /\n Shows the i'th element in the timeline, counting from zero. Does nothing if i out of range.\n */\n private showTab(i: number) {\n const tabs = this.host.shadowRoot?.querySelectorAll<HTMLElement>('.navigation ul li')!;\n const entries = this.host.shadowRoot?.querySelectorAll<HTMLElement>('.entry')!;\n\n if (tabs.length > 0) {\n this.scrollContextTab = this.host.shadowRoot?.querySelector<HTMLElement>('.navigation ul li')!;\n }\n\n if (i >= 0 && i <= tabs?.length - 1) {\n let currentTabTitle = tabs[i]?.innerHTML;\n let j = 0;\n tabs?.forEach(function (tab) {\n if (i == j) {\n tab.classList.add('selected');\n } else {\n tab.classList.remove('selected');\n }\n j++;\n });\n\n entries.forEach(function (entry) {\n entry.style.display = entry.getAttribute('data-date')?.substring(0, 4) == currentTabTitle ? 'block' : 'none';\n });\n }\n }\n\n private clickTabHandler = (e: any) => {\n let i = 0;\n for (let el of e.target.parentElement.children) {\n if (el == e.target) {\n this.showTab(i);\n return;\n }\n i++;\n }\n };\n\n private scrollTab(direction: 'NEXT' \| 'PREV') {\n if (!this.scrollContextTab) {\n return;\n }\n\n let sleeve: HTMLElement = this.scrollContextTab.parentElement!;\n let max = sleeve.scrollWidth - sleeve.parentElement?.offsetWidth!;\n\n if (direction == 'PREV') {\n if (this.scrollOffset + this.scrollContextTab.offsetWidth > 0) {\n return;\n }\n\n this.scrollOffset = this.scrollOffset + this.scrollContextTab.offsetWidth;\n if (this.scrollContextTab.previousElementSibling) {\n this.scrollContextTab = this.scrollContextTab.previousElementSibling as HTMLElement;\n }\n } else if (direction == 'NEXT') {\n if (0 - this.scrollOffset > max) {\n return;\n }\n\n this.scrollOffset = this.scrollOffset - this.scrollContextTab.offsetWidth;\n if (this.scrollContextTab.nextElementSibling) {\n this.scrollContextTab = this.scrollContextTab.nextElementSibling as HTMLElement;\n }\n }\n\n sleeve.querySelectorAll('li').forEach(li => {\n li.style.transitionDuration = '0.3s';\n li.style.transitionTimingFunction = 'ease-out';\n li.style.transform = 'translate3d(' + this.scrollOffset + 'px, 0, 0)';\n });\n }\n\n private clickPrevHandler = () => {\n this.scrollTab('PREV');\n };\n\n private clickNextHandler = () => {\n this.scrollTab('NEXT');\n };\n\n render() {\n return (\n <div\n class={\n 'container space-below-' +\n this.spaceBelow +\n ' text-colour-' +\n this.textColour +\n ' selected-text-colour-' +\n this.selectedTextColour +\n ' navigation-highlight-colour-' +\n this.navigationHighlightColour +\n ' selected-navigation-highlight-colour-' +\n this.selectedNavigationHighlightColour +\n ' button-background-colour-' +\n this.buttonBackgroundColour +\n ' button-icon-colour-' +\n this.buttonIconColour +\n ' entry-background-colour-' +\n this.entryBackgroundColour +\n ' entry-highlight-colour-' +\n this.entryHighlightColour +\n ' entry-date-colour-' +\n this.entryDateColour +\n ' entry-title-colour-' +\n this.entryTitleColour +\n ' entry-text-colour-' +\n this.entryTextColour\n }\n >\n <div class=\"navigation\">\n <div class=\"button prev\" onClick={this.clickPrevHandler} title=\"Previous\">\n <svg width=\"9\" height=\"16\" viewBox=\"0 0 9 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8.29311 14.5703L1.73926 8.01646L8.29311 1.46261\" stroke=\"#000000\" stroke-width=\"2\" />\n </svg>\n </div>\n <div class=\"sleeve\">\n <ul>\n {this.tabHeadings.map(tab => (\n <li onClick={this.clickTabHandler}>{tab}</li>\n ))}\n </ul>\n </div>\n <div class=\"button next\" onClick={this.clickNextHandler} title=\"Next\">\n <svg width=\"9\" height=\"16\" viewBox=\"0 0 9 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M0.739117 1.46094L7.29297 8.01479L0.739118 14.5686\" stroke=\"#000000\" stroke-width=\"2\" />\n </svg>\n </div>\n </div>\n <div class=\"entry-wrap\">\n {this.children.map(entry => (\n <div class=\"entry\" data-date={entry.date}>\n <h4 class=\"title\">{entry.heading}</h4>\n <div class=\"content\" innerHTML={entry.innerHTML}></div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/biggive-totalizer/biggive-totalizer.js CHANGED Viewed

@@ -82,7 +82,7 @@ export class BiggiveTotalizer {
         });
     }
     render() {
-        return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", null, h("div", { class: "banner" }, h("div", { class: 'main-message-wrap background-colour-' + this.secondaryColour + ' text-colour-' + this.secondaryTextColour }, this.mainMessage), h("div", { class: 'ticker-wrap background-colour-' + this.primaryColour + ' text-colour-' + this.primaryTextColour }, h("div", { id: "sleeve_1", class: "sleeve" }, h("slot", { name: "ticker-items" })), h("div", { id: "sleeve_2", class: "sleeve sleeve-delayed-copy" }), h("div", { id: "sleeve_3", class: "sleeve sleeve-delayed-copy" }), h("div", { id: "sleeve_4", class: "sleeve sleeve-delayed-copy" }))))));
+        return (h("div", { key: '4ecdacf74f838683944619c97ebb68744a0af5da', class: 'container space-below-' + this.spaceBelow }, h("div", { key: '56264afd6331ab27e2016b3c53a2404d503726d4' }, h("div", { key: '1602eb2098650f4eef052e2670dc909cfbd0fac2', class: "banner" }, h("div", { key: '4e71eb72267f5f3c07e4ee300a13f9a739668f4a', class: 'main-message-wrap background-colour-' + this.secondaryColour + ' text-colour-' + this.secondaryTextColour }, this.mainMessage), h("div", { key: '0ec41320eefbabe9fb5e154b14f5e03e97a0ac8e', class: 'ticker-wrap background-colour-' + this.primaryColour + ' text-colour-' + this.primaryTextColour }, h("div", { key: 'd896541f9c20116b6f94452347622cac1857108c', id: "sleeve_1", class: "sleeve" }, h("slot", { key: '836d2b6fa73db83208b4c3f6944475932db73887', name: "ticker-items" })), h("div", { key: '541e3b3cea3be2e428e41ffa32ea4be1c4d05593', id: "sleeve_2", class: "sleeve sleeve-delayed-copy" }), h("div", { key: '987778b55bf30fe3cd15e7c183108df699648a25', id: "sleeve_3", class: "sleeve sleeve-delayed-copy" }), h("div", { key: '2ee144b6327c7333478bd608da341100f51bcde5', id: "sleeve_4", class: "sleeve sleeve-delayed-copy" }))))));
     }
     static get is() { return "biggive-totalizer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/biggive-totalizer/biggive-totalizer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biggive-totalizer.js","sourceRoot":"","sources":["../../../src/components/biggive-totalizer/biggive-totalizer.tsx"],"names":[],"mappings":"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~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU;YACpD;gBACE,~~WAAK~~,KAAK,EAAC,QAAQ;oBACjB,~~WAAK~~,KAAK,EAAE,sCAAsC,GAAG,IAAI,CAAC,eAAe,GAAG,eAAe,GAAG,IAAI,CAAC,mBAAmB,IAAG,IAAI,CAAC,WAAW,CAAO;oBAChJ,~~WAAK~~,KAAK,EAAE,gCAAgC,GAAG,IAAI,CAAC,aAAa,GAAG,eAAe,GAAG,IAAI,CAAC,iBAAiB;wBAC1G,~~WAAK~~,EAAE,EAAC,UAAU,EAAC,KAAK,EAAC,QAAQ;4BAC/B,~~YAAM~~,IAAI,EAAC,cAAc,GAAQ,CAC7B;wBACN,~~WAAK~~,EAAE,EAAC,UAAU,EAAC,KAAK,EAAC,4BAA4B,GAE/C;wBACN,~~WAAK~~,EAAE,EAAC,UAAU,EAAC,KAAK,EAAC,4BAA4B,GAAO;wBAC5D,~~WAAK~~,EAAE,EAAC,UAAU,EAAC,KAAK,EAAC,4BAA4B,GAAO,CACxD,CACF,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-totalizer',\n styleUrl: 'biggive-totalizer.scss',\n shadow: true,\n})\nexport class BiggiveTotalizer {\n private lastWrapperWidth: number = 0;\n\n @Element() host: HTMLBiggiveTotalizerElement;\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Primary banner colour\n /\n @Prop() primaryColour: string = 'primary';\n\n /\n Primary text colour\n /\n @Prop() primaryTextColour: string = 'white';\n\n /\n Secondary banner colour\n /\n @Prop() secondaryColour: string = 'secondary';\n\n /\n Secondary text colour\n /\n @Prop() secondaryTextColour: string = 'black';\n\n /\n Primary message\n /\n @Prop() mainMessage: string;\n\n private setSpeed(itemsWidth: number, containerWidth: number) {\n console.log('setSpeed() called with itemsWidth=' + itemsWidth + ', containerWidth=' + containerWidth);\n\n if (containerWidth === this.lastWrapperWidth) {\n // Some browsers fire 'resize' overzealously on scroll; we don't want to cause extra paints if nothing\n // relevant changed.\n return;\n }\n\n let sleeves: HTMLDivElement[] = [];\n for (const ii in [1, 2, 3, 4]) {\n const sleeve = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_' + ii) as HTMLDivElement \| null;\n if (sleeve) {\n sleeves.push(sleeve);\n // Restart the animation(s) on window resize to reduce the chance of jankiness.\n // https://stackoverflow.com/a/45036752/2803757\n sleeve.style.animationName = 'none';\n }\n }\n\n this.lastWrapperWidth = containerWidth;\n\n if (sleeves.length === 0) {\n console.log('sleeves missing, skipping setSpeed()');\n return;\n }\n\n // We've seen the initial calculation exclude the ~30px per set of values end padding before,\n // and it's safe to err on the side of more copies to reduce the chance of abrupt early loop\n // ends, so we add a buffer of 40px to the calculation when deciding how many copies to use.\n // const sleeveCount = Math.max(1, Math.min(4, Math.ceil((2 (40 + itemsWidth)) / containerWidth)));\n // TODO Ultimately we'd like to get multiple copies working, or simplify. This\n // has proven very hard to iterate on pending a fix for DON-867 because\n // there is Angular-specific behaviour breaking the contents of copies.\n const sleeveCount = 1;\n this.host.style.setProperty('--ticker-end-left', `-${(sleeveCount + 1) * 100}%`);\n\n const duration = Math.round((itemsWidth / 50) * sleeveCount);\n\n for (let ii = 1; ii <= sleeveCount; ii++) {\n const sleeve = sleeves[ii - 1];\n if (sleeve) {\n sleeve.style.animationDuration = duration + 's';\n // https://stackoverflow.com/a/45847760\n sleeve.style.animationDelay = (duration / (sleeveCount - 1)) * (ii - 1) + 's';\n sleeve.style.display = 'inline-flex';\n sleeve.style.animationName = 'ticker';\n }\n }\n }\n\n componentDidLoad() {\n const wrapper = this.host.shadowRoot?.querySelector('.ticker-wrap') as HTMLDivElement;\n\n const tickerItemsInternalWrapper: HTMLDivElement \| null = this.host.querySelector(`[slot=\"ticker-items\"]`);\n const sleeve1: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_1');\n const sleeve2: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_2');\n const sleeve3: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_3');\n const sleeve4: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_4');\n\n if (!tickerItemsInternalWrapper \|\| !sleeve1) {\n console.log('tickerItemsInternalWrapper or sleeve1 is missing, skipping totalizer animation setup');\n return;\n }\n\n // Deep clone [all children of] the ticker items internal wrapper and append them, so the ticker can show items without\n // a blank break. Sleeve 2 and up will animate on delays per https://stackoverflow.com/a/45847760.\n setTimeout(() => {\n sleeve2 && sleeve2.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n sleeve3 && sleeve3.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n sleeve4 && sleeve4.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n }, 800);\n\n setTimeout(() => {\n // In Angular contexts, it seems like we need to leave a little time before the calculations work.\n // Not totally clear why yet.\n this.setSpeed(tickerItemsInternalWrapper.clientWidth, wrapper.clientWidth);\n }, 300);\n\n window.addEventListener('resize', () => {\n this.setSpeed(tickerItemsInternalWrapper.clientWidth, wrapper.clientWidth);\n });\n }\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n <div>\n <div class=\"banner\">\n <div class={'main-message-wrap background-colour-' + this.secondaryColour + ' text-colour-' + this.secondaryTextColour}>{this.mainMessage}</div>\n <div class={'ticker-wrap background-colour-' + this.primaryColour + ' text-colour-' + this.primaryTextColour}>\n <div id=\"sleeve_1\" class=\"sleeve\">\n <slot name=\"ticker-items\"></slot>\n </div>\n <div id=\"sleeve_2\" class=\"sleeve sleeve-delayed-copy\">\n {/* Contents for these 3 are copied in TS and copies shown or hidden based on available space */}\n </div>\n <div id=\"sleeve_3\" class=\"sleeve sleeve-delayed-copy\"></div>\n <div id=\"sleeve_4\" class=\"sleeve sleeve-delayed-copy\"></div>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"biggive-totalizer.js","sourceRoot":"","sources":["../../../src/components/biggive-totalizer/biggive-totalizer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-totalizer',\n styleUrl: 'biggive-totalizer.scss',\n shadow: true,\n})\nexport class BiggiveTotalizer {\n private lastWrapperWidth: number = 0;\n\n @Element() host: HTMLBiggiveTotalizerElement;\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Primary banner colour\n /\n @Prop() primaryColour: string = 'primary';\n\n /\n Primary text colour\n /\n @Prop() primaryTextColour: string = 'white';\n\n /\n Secondary banner colour\n /\n @Prop() secondaryColour: string = 'secondary';\n\n /\n Secondary text colour\n /\n @Prop() secondaryTextColour: string = 'black';\n\n /\n Primary message\n /\n @Prop() mainMessage: string;\n\n private setSpeed(itemsWidth: number, containerWidth: number) {\n console.log('setSpeed() called with itemsWidth=' + itemsWidth + ', containerWidth=' + containerWidth);\n\n if (containerWidth === this.lastWrapperWidth) {\n // Some browsers fire 'resize' overzealously on scroll; we don't want to cause extra paints if nothing\n // relevant changed.\n return;\n }\n\n let sleeves: HTMLDivElement[] = [];\n for (const ii in [1, 2, 3, 4]) {\n const sleeve = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_' + ii) as HTMLDivElement \| null;\n if (sleeve) {\n sleeves.push(sleeve);\n // Restart the animation(s) on window resize to reduce the chance of jankiness.\n // https://stackoverflow.com/a/45036752/2803757\n sleeve.style.animationName = 'none';\n }\n }\n\n this.lastWrapperWidth = containerWidth;\n\n if (sleeves.length === 0) {\n console.log('sleeves missing, skipping setSpeed()');\n return;\n }\n\n // We've seen the initial calculation exclude the ~30px per set of values end padding before,\n // and it's safe to err on the side of more copies to reduce the chance of abrupt early loop\n // ends, so we add a buffer of 40px to the calculation when deciding how many copies to use.\n // const sleeveCount = Math.max(1, Math.min(4, Math.ceil((2 (40 + itemsWidth)) / containerWidth)));\n // TODO Ultimately we'd like to get multiple copies working, or simplify. This\n // has proven very hard to iterate on pending a fix for DON-867 because\n // there is Angular-specific behaviour breaking the contents of copies.\n const sleeveCount = 1;\n this.host.style.setProperty('--ticker-end-left', `-${(sleeveCount + 1) * 100}%`);\n\n const duration = Math.round((itemsWidth / 50) * sleeveCount);\n\n for (let ii = 1; ii <= sleeveCount; ii++) {\n const sleeve = sleeves[ii - 1];\n if (sleeve) {\n sleeve.style.animationDuration = duration + 's';\n // https://stackoverflow.com/a/45847760\n sleeve.style.animationDelay = (duration / (sleeveCount - 1)) * (ii - 1) + 's';\n sleeve.style.display = 'inline-flex';\n sleeve.style.animationName = 'ticker';\n }\n }\n }\n\n componentDidLoad() {\n const wrapper = this.host.shadowRoot?.querySelector('.ticker-wrap') as HTMLDivElement;\n\n const tickerItemsInternalWrapper: HTMLDivElement \| null = this.host.querySelector(`[slot=\"ticker-items\"]`);\n const sleeve1: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_1');\n const sleeve2: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_2');\n const sleeve3: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_3');\n const sleeve4: HTMLDivElement \| null \| undefined = this.host.shadowRoot?.querySelector('.ticker-wrap #sleeve_4');\n\n if (!tickerItemsInternalWrapper \|\| !sleeve1) {\n console.log('tickerItemsInternalWrapper or sleeve1 is missing, skipping totalizer animation setup');\n return;\n }\n\n // Deep clone [all children of] the ticker items internal wrapper and append them, so the ticker can show items without\n // a blank break. Sleeve 2 and up will animate on delays per https://stackoverflow.com/a/45847760.\n setTimeout(() => {\n sleeve2 && sleeve2.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n sleeve3 && sleeve3.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n sleeve4 && sleeve4.appendChild(tickerItemsInternalWrapper.cloneNode(true));\n }, 800);\n\n setTimeout(() => {\n // In Angular contexts, it seems like we need to leave a little time before the calculations work.\n // Not totally clear why yet.\n this.setSpeed(tickerItemsInternalWrapper.clientWidth, wrapper.clientWidth);\n }, 300);\n\n window.addEventListener('resize', () => {\n this.setSpeed(tickerItemsInternalWrapper.clientWidth, wrapper.clientWidth);\n });\n }\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n <div>\n <div class=\"banner\">\n <div class={'main-message-wrap background-colour-' + this.secondaryColour + ' text-colour-' + this.secondaryTextColour}>{this.mainMessage}</div>\n <div class={'ticker-wrap background-colour-' + this.primaryColour + ' text-colour-' + this.primaryTextColour}>\n <div id=\"sleeve_1\" class=\"sleeve\">\n <slot name=\"ticker-items\"></slot>\n </div>\n <div id=\"sleeve_2\" class=\"sleeve sleeve-delayed-copy\">\n {/* Contents for these 3 are copied in TS and copies shown or hidden based on available space */}\n </div>\n <div id=\"sleeve_3\" class=\"sleeve sleeve-delayed-copy\"></div>\n <div id=\"sleeve_4\" class=\"sleeve sleeve-delayed-copy\"></div>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/biggive-totalizer-ticker-item/biggive-totalizer-ticker-item.js CHANGED Viewed

@@ -5,7 +5,7 @@ export class BiggiveTotalizerTickerItem {
         this.label = undefined;
     }
     render() {
-        return (h("div", { class: "ticker-item" }, h("strong", null, this.figure), " ", this.label));
+        return (h("div", { key: 'afb95bb654892517ef199abcad04b888f13a596c', class: "ticker-item" }, h("strong", { key: 'afd8e3e88e4e6f008cd037b2dcd9a429d6cb108f' }, this.figure), " ", this.label));
     }
     static get is() { return "biggive-totalizer-ticker-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/biggive-totalizer-ticker-item/biggive-totalizer-ticker-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biggive-totalizer-ticker-item.js","sourceRoot":"","sources":["../../../src/components/biggive-totalizer-ticker-item/biggive-totalizer-ticker-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,0BAA0B;;;;;IAWrC,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAC,aAAa;YACtB,~~kBAAS~~,IAAI,CAAC,MAAM,CAAU;;YAAE,IAAI,CAAC,KAAK,CACtC,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-totalizer-ticker-item',\n styleUrl: 'biggive-totalizer-ticker-item.scss',\n shadow: true,\n})\nexport class BiggiveTotalizerTickerItem {\n /*\n Figure\n /\n @Prop() figure: string;\n\n /\n Figure\n */\n @Prop() label: string;\n\n render() {\n return (\n <div class=\"ticker-item\">\n <strong>{this.figure}</strong> {this.label}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"biggive-totalizer-ticker-item.js","sourceRoot":"","sources":["../../../src/components/biggive-totalizer-ticker-item/biggive-totalizer-ticker-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,0BAA0B;;;;;IAWrC,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,aAAa;YACtB,iEAAS,IAAI,CAAC,MAAM,CAAU;;YAAE,IAAI,CAAC,KAAK,CACtC,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-totalizer-ticker-item',\n styleUrl: 'biggive-totalizer-ticker-item.scss',\n shadow: true,\n})\nexport class BiggiveTotalizerTickerItem {\n /*\n Figure\n /\n @Prop() figure: string;\n\n /\n Figure\n */\n @Prop() label: string;\n\n render() {\n return (\n <div class=\"ticker-item\">\n <strong>{this.figure}</strong> {this.label}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/biggive-video/biggive-video.js CHANGED Viewed

@@ -7,7 +7,7 @@ export class BiggiveVideo {
         this.videoUrl = '';
     }
     render() {
-        return (h("div", { class: 'container space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow }, h("div", { class: "video-wrap", innerHTML: VideoService.getEmbedHtml(this.videoUrl, null) })));
+        return (h("div", { key: 'f018ff7a0d91d8812151efb58e1316df2ecb8184', class: 'container space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow }, h("div", { key: '35327491c32d9028b49786d9dcc0ab9193324e08', class: "video-wrap", innerHTML: VideoService.getEmbedHtml(this.videoUrl, null) })));
     }
     static get is() { return "biggive-video"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/biggive-video/biggive-video.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biggive-video.js","sourceRoot":"","sources":["../../../src/components/biggive-video/biggive-video.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhD,MAAM,OAAO,YAAY;;0BAIM,CAAC;0BAID,CAAC;wBAIH,EAAE;;IAE7B,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU;YACxF,~~WAAK~~,KAAK,EAAC,YAAY,EAAC,SAAS,EAAE,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,GAAQ,CACrF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { VideoService } from '../../util/video';\n\n@Component({\n tag: 'biggive-video',\n styleUrl: 'biggive-video.scss',\n shadow: true,\n})\nexport class BiggiveVideo {\n /*\n Space above component\n /\n @Prop() spaceAbove: number = 0;\n /\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Full URL of a video.\n */\n @Prop() videoUrl: string = '';\n\n render() {\n return (\n <div class={'container space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow}>\n <div class=\"video-wrap\" innerHTML={VideoService.getEmbedHtml(this.videoUrl, null)}></div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"biggive-video.js","sourceRoot":"","sources":["../../../src/components/biggive-video/biggive-video.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhD,MAAM,OAAO,YAAY;;0BAIM,CAAC;0BAID,CAAC;wBAIH,EAAE;;IAE7B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU;YACxF,4DAAK,KAAK,EAAC,YAAY,EAAC,SAAS,EAAE,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,GAAQ,CACrF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { VideoService } from '../../util/video';\n\n@Component({\n tag: 'biggive-video',\n styleUrl: 'biggive-video.scss',\n shadow: true,\n})\nexport class BiggiveVideo {\n /*\n Space above component\n /\n @Prop() spaceAbove: number = 0;\n /\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Full URL of a video.\n */\n @Prop() videoUrl: string = '';\n\n render() {\n return (\n <div class={'container space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow}>\n <div class=\"video-wrap\" innerHTML={VideoService.getEmbedHtml(this.videoUrl, null)}></div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/biggive-video-feature/biggive-video-feature.js CHANGED Viewed

@@ -18,7 +18,7 @@ export class BiggiveVideoFeature {
     }
     render() {
         const youtubeClass = this.videoUrl.includes('youtube.com') ? ' youtube' : '';
-        return (h("div", { class: 'container text-colour-' + this.defaultTextColour + ' space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "content-wrap" }, h("div", { class: 'slug text-colour-' + this.slugColour }, this.slug), h("h2", { class: 'title text-colour-' + this.mainTitleColour }, this.mainTitle), h("div", { class: 'teaser text-colour-' + this.teaserColour }, this.teaser), this.buttonLabel != null && this.buttonUrl != null ? (h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel })) : null), h("div", { class: "graphic-wrap" }, this.videoUrl !== null && this.videoUrl !== undefined ? (h("div", { class: 'video-wrap' + youtubeClass, innerHTML: VideoService.getEmbedHtml(this.videoUrl, this.mainTitle) })) : null))));
+        return (h("div", { key: '2de9c808246be7c2d40ef80c310a454988451489', class: 'container text-colour-' + this.defaultTextColour + ' space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow }, h("div", { key: 'd3c66d90fef509f7fe1e474f5f15908f4b4a3830', class: "sleeve" }, h("div", { key: 'b1d0e4b5e968c9891e5e9ff2691cfdf71de8c093', class: "content-wrap" }, h("div", { key: '89f74432a65211bf75cc834edb7359633b0e7d45', class: 'slug text-colour-' + this.slugColour }, this.slug), h("h2", { key: '4ab81ed2b88b79d49e7eae895fe001019a334a1a', class: 'title text-colour-' + this.mainTitleColour }, this.mainTitle), h("div", { key: '046ba0757343f10f3e84b6f70cb6c377cc62aa42', class: 'teaser text-colour-' + this.teaserColour }, this.teaser), this.buttonLabel != null && this.buttonUrl != null ? (h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel })) : null), h("div", { key: '68cfe2bbff4996307240fbfa610cad410850f585', class: "graphic-wrap" }, this.videoUrl !== null && this.videoUrl !== undefined ? (h("div", { class: 'video-wrap' + youtubeClass, innerHTML: VideoService.getEmbedHtml(this.videoUrl, this.mainTitle) })) : null))));
     }
     static get is() { return "biggive-video-feature"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/biggive-video-feature/biggive-video-feature.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biggive-video-feature.js","sourceRoot":"","sources":["../../../src/components/biggive-video-feature/biggive-video-feature.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhD,MAAM,OAAO,mBAAmB;;0BAID,CAAC;0BAID,CAAC;iCAIM,SAAS;wBAKlB,EAAE;;0BAUA,EAAE;;+BAUG,EAAE;;4BAUL,EAAE;;;kCAeI,SAAS;;IAE9C,MAAM;QACJ,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;QAE7E,OAAO,CACL,~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,iBAAiB,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU;YACnI,~~WAAK~~,KAAK,EAAC,QAAQ;gBACjB,~~WAAK~~,KAAK,EAAC,cAAc;oBACvB,~~WAAK~~,KAAK,EAAE,mBAAmB,GAAG,IAAI,CAAC,UAAU,IAAG,IAAI,CAAC,IAAI,CAAO;oBACpE,~~UAAI~~,KAAK,EAAE,oBAAoB,GAAG,IAAI,CAAC,eAAe,IAAG,IAAI,CAAC,SAAS,CAAM;oBAC7E,~~WAAK~~,KAAK,EAAE,qBAAqB,GAAG,IAAI,CAAC,YAAY,IAAG,IAAI,CAAC,MAAM,CAAO;oBACzE,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,CACpD,uCAA+B,IAAI,CAAC,kBAAkB,EAAE,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GAAmB,CACxH,CAAC,CAAC,CAAC,IAAI,CACJ;gBACN,~~WAAK~~,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,CACvD,WAAK,KAAK,EAAE,YAAY,GAAG,YAAY,EAAE,SAAS,EAAE,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,GAAQ,CACrH,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { VideoService } from '../../util/video';\n\n@Component({\n tag: 'biggive-video-feature',\n styleUrl: 'biggive-video-feature.scss',\n shadow: true,\n})\nexport class BiggiveVideoFeature {\n /*\n Space above component\n /\n @Prop() spaceAbove: number = 0;\n /\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Default text colour\n /\n @Prop() defaultTextColour: string = 'primary';\n\n /\n Full URL of a video.\n /\n @Prop() videoUrl: string = '';\n\n /\n Slug\n /\n @Prop() slug: string;\n\n /\n Slug colour\n /\n @Prop() slugColour: string = '';\n\n /\n Video title\n /\n @Prop() mainTitle: string;\n\n /\n Slug colour\n /\n @Prop() mainTitleColour: string = '';\n\n /\n Introductory teaser text\n /\n @Prop() teaser: string;\n\n /\n Teaser colour\n /\n @Prop() teaserColour: string = '';\n\n /\n Button Url\n /\n @Prop() buttonUrl: string;\n\n /\n Button Label\n /\n @Prop() buttonLabel: string;\n\n /\n Button Colour Scheme\n */\n @Prop() buttonColourScheme: string = 'primary';\n\n render() {\n const youtubeClass = this.videoUrl.includes('youtube.com') ? ' youtube' : '';\n\n return (\n <div class={'container text-colour-' + this.defaultTextColour + ' space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow}>\n <div class=\"sleeve\">\n <div class=\"content-wrap\">\n <div class={'slug text-colour-' + this.slugColour}>{this.slug}</div>\n <h2 class={'title text-colour-' + this.mainTitleColour}>{this.mainTitle}</h2>\n <div class={'teaser text-colour-' + this.teaserColour}>{this.teaser}</div>\n {this.buttonLabel != null && this.buttonUrl != null ? (\n <biggive-button colour-scheme={this.buttonColourScheme} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n ) : null}\n </div>\n <div class=\"graphic-wrap\">\n {this.videoUrl !== null && this.videoUrl !== undefined ? (\n <div class={'video-wrap' + youtubeClass} innerHTML={VideoService.getEmbedHtml(this.videoUrl, this.mainTitle)}></div>\n ) : null}\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"biggive-video-feature.js","sourceRoot":"","sources":["../../../src/components/biggive-video-feature/biggive-video-feature.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOhD,MAAM,OAAO,mBAAmB;;0BAID,CAAC;0BAID,CAAC;iCAIM,SAAS;wBAKlB,EAAE;;0BAUA,EAAE;;+BAUG,EAAE;;4BAUL,EAAE;;;kCAeI,SAAS;;IAE9C,MAAM;QACJ,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;QAE7E,OAAO,CACL,4DAAK,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,iBAAiB,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU;YACnI,4DAAK,KAAK,EAAC,QAAQ;gBACjB,4DAAK,KAAK,EAAC,cAAc;oBACvB,4DAAK,KAAK,EAAE,mBAAmB,GAAG,IAAI,CAAC,UAAU,IAAG,IAAI,CAAC,IAAI,CAAO;oBACpE,2DAAI,KAAK,EAAE,oBAAoB,GAAG,IAAI,CAAC,eAAe,IAAG,IAAI,CAAC,SAAS,CAAM;oBAC7E,4DAAK,KAAK,EAAE,qBAAqB,GAAG,IAAI,CAAC,YAAY,IAAG,IAAI,CAAC,MAAM,CAAO;oBACzE,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,CACpD,uCAA+B,IAAI,CAAC,kBAAkB,EAAE,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GAAmB,CACxH,CAAC,CAAC,CAAC,IAAI,CACJ;gBACN,4DAAK,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,CACvD,WAAK,KAAK,EAAE,YAAY,GAAG,YAAY,EAAE,SAAS,EAAE,YAAY,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,GAAQ,CACrH,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { VideoService } from '../../util/video';\n\n@Component({\n tag: 'biggive-video-feature',\n styleUrl: 'biggive-video-feature.scss',\n shadow: true,\n})\nexport class BiggiveVideoFeature {\n /*\n Space above component\n /\n @Prop() spaceAbove: number = 0;\n /\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Default text colour\n /\n @Prop() defaultTextColour: string = 'primary';\n\n /\n Full URL of a video.\n /\n @Prop() videoUrl: string = '';\n\n /\n Slug\n /\n @Prop() slug: string;\n\n /\n Slug colour\n /\n @Prop() slugColour: string = '';\n\n /\n Video title\n /\n @Prop() mainTitle: string;\n\n /\n Slug colour\n /\n @Prop() mainTitleColour: string = '';\n\n /\n Introductory teaser text\n /\n @Prop() teaser: string;\n\n /\n Teaser colour\n /\n @Prop() teaserColour: string = '';\n\n /\n Button Url\n /\n @Prop() buttonUrl: string;\n\n /\n Button Label\n /\n @Prop() buttonLabel: string;\n\n /\n Button Colour Scheme\n */\n @Prop() buttonColourScheme: string = 'primary';\n\n render() {\n const youtubeClass = this.videoUrl.includes('youtube.com') ? ' youtube' : '';\n\n return (\n <div class={'container text-colour-' + this.defaultTextColour + ' space-above-' + this.spaceAbove + ' space-below-' + this.spaceBelow}>\n <div class=\"sleeve\">\n <div class=\"content-wrap\">\n <div class={'slug text-colour-' + this.slugColour}>{this.slug}</div>\n <h2 class={'title text-colour-' + this.mainTitleColour}>{this.mainTitle}</h2>\n <div class={'teaser text-colour-' + this.teaserColour}>{this.teaser}</div>\n {this.buttonLabel != null && this.buttonUrl != null ? (\n <biggive-button colour-scheme={this.buttonColourScheme} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n ) : null}\n </div>\n <div class=\"graphic-wrap\">\n {this.videoUrl !== null && this.videoUrl !== undefined ? (\n <div class={'video-wrap' + youtubeClass} innerHTML={VideoService.getEmbedHtml(this.videoUrl, this.mainTitle)}></div>\n ) : null}\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/components/biggive-accordion.js CHANGED Viewed

@@ -30,7 +30,7 @@ const BiggiveAccordion$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveAccordi
         }
     }
     render() {
-        return (h("div", { class: 'container' + ' space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' heading-colour-' + this.headingColour }, h("div", { class: "sleeve" }, this.children === undefined
+        return (h("div", { key: 'ded1cf1eef6c83c9ed50860d7d2a281801441cf7', class: 'container' + ' space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' heading-colour-' + this.headingColour }, h("div", { key: '2b9114d364ddd19b95f9c9c7f572c50bd2dd61e1', class: "sleeve" }, this.children === undefined
             ? []
             : this.children.map(entry => (h("div", { class: "entry" }, h("h3", { class: "heading", onClick: this.toggleSection, title: "Expand section" }, entry.heading, h("span", { class: "arrow" }, h("svg", { width: "15", height: "9", viewBox: "0 0 15 9", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M14.1074 0.999859L7.55357 7.55371L0.999718 0.99986", stroke: "black", "stroke-width": "2" })))), h("div", { class: "content", innerHTML: entry.innerHTML })))))));
     }

package/dist/components/biggive-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-accordion.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,2vOAA2vO,CAAC;AACxxO,+BAAe,mBAAmB;;MCQrBA,kBAAgB;;;;;0BAGS,CAAC;0BAEH,OAAO;6BAEJ,SAAS;;;IAI9C,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAA4C,CAAC;KAC3F;IAEO,aAAa,CAAC,CAAa;QACjC,MAAM,MAAM,GAAI,CAAC,CAAC,MAAmB,CAAC;QACtC,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAE,CAAC;QACxC,MAAM,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAE,CAAC;QAE7C,IAAI,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;YACxC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACnC,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC;SAC/C;aAAM;YACL,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;YAChC,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC;SACjD;KACF;IAED,MAAM;QACJ,QACE,~~WAAK~~,KAAK,EAAE,WAAW,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,kBAAkB,GAAG,IAAI,CAAC,aAAa,IACvI,~~WAAK~~,KAAK,EAAC,QAAQ,IAChB,IAAI,CAAC,QAAQ,KAAK,SAAS;cACxB,EAAE;cACF,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,KACrB,WAAK,KAAK,EAAC,OAAO,IAChB,UAAI,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAC,gBAAgB,IACpE,KAAK,CAAC,OAAO,EACd,YAAM,KAAK,EAAC,OAAO,IACjB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAC,OAAO,EAAC,UAAU,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC1F,YAAM,CAAC,EAAC,oDAAoD,EAAC,MAAM,EAAC,OAAO,kBAAc,GAAG,GAAG,CAC3F,CACD,CACJ,EACL,WAAK,KAAK,EAAC,SAAS,EAAC,SAAS,EAAE,KAAK,CAAC,SAAS,GAAQ,CACnD,CACP,CAAC,CACF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveAccordion"],"sources":["src/components/biggive-accordion/biggive-accordion.scss?tag=biggive-accordion&encapsulation=shadow","src/components/biggive-accordion/biggive-accordion.tsx"],"sourcesContent":["@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n\n\n .entry {\n h3.heading {\n position: relative;\n margin: 25px 0 0 0;\n padding: 15px 60px 10px 20px;\n border-bottom: 1px solid $colour-black;\n cursor: pointer;\n span.arrow {\n display: block;\n position: absolute;\n right: 20px;\n top: 10px;\n width: 40px;\n height: 20px;\n text-align: center;\n }\n }\n .content {\n overflow: hidden;\n max-height: 0;\n padding: 0 20px;\n }\n &.expanded {\n .content {\n max-height: 100%;\n }\n span.arrow {\n transform: rotate(-180deg);\n }\n }\n }\n\n @each $key, $colour in $brandColoursIncBrand6Turquoise {\n &.heading-colour-#{$key} .entry h3.heading svg path { stroke: $colour; }\n &.heading-colour-#{$key} h3.heading { color: $colour; }\n &.text-colour-#{$key} .content { color: $colour; }\n }\n\n\n}\n\n\n","import { Component, Element, h, Prop, State } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-accordion',\n styleUrl: 'biggive-accordion.scss',\n shadow: true,\n})\nexport class BiggiveAccordion {\n @Element() host: HTMLBiggiveAccordionElement;\n\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() headingColour: brandColour = 'primary';\n\n @State() children: Array<HTMLBiggiveAccordionEntryElement>;\n\n componentWillLoad() {\n this.children = Array.from(this.host.children) as Array<HTMLBiggiveAccordionEntryElement>;\n }\n\n private toggleSection(e: MouseEvent) {\n const target = (e.target as Element)!;\n const entry = target.closest('.entry')!;\n const arrow = entry.querySelector('.arrow')!;\n\n if (entry.classList.contains('expanded')) {\n entry.classList.remove('expanded');\n arrow.setAttribute('title', 'Expand section');\n } else {\n entry.classList.add('expanded');\n arrow.setAttribute('title', 'Collapse section');\n }\n }\n\n render() {\n return (\n <div class={'container' + ' space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' heading-colour-' + this.headingColour}>\n <div class=\"sleeve\">\n {this.children === undefined\n ? []\n : this.children.map(entry => (\n <div class=\"entry\">\n <h3 class=\"heading\" onClick={this.toggleSection} title=\"Expand section\">\n {entry.heading}\n <span class=\"arrow\">\n <svg width=\"15\" height=\"9\" viewBox=\"0 0 15 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14.1074 0.999859L7.55357 7.55371L0.999718 0.99986\" stroke=\"black\" stroke-width=\"2\" />\n </svg>\n </span>\n </h3>\n <div class=\"content\" innerHTML={entry.innerHTML}></div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-accordion.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,2vOAA2vO,CAAC;AACxxO,+BAAe,mBAAmB;;MCQrBA,kBAAgB;;;;;0BAGS,CAAC;0BAEH,OAAO;6BAEJ,SAAS;;;IAI9C,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAA4C,CAAC;KAC3F;IAEO,aAAa,CAAC,CAAa;QACjC,MAAM,MAAM,GAAI,CAAC,CAAC,MAAmB,CAAC;QACtC,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAE,CAAC;QACxC,MAAM,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAE,CAAC;QAE7C,IAAI,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;YACxC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACnC,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC;SAC/C;aAAM;YACL,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;YAChC,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC;SACjD;KACF;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,WAAW,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,GAAG,kBAAkB,GAAG,IAAI,CAAC,aAAa,IACvI,4DAAK,KAAK,EAAC,QAAQ,IAChB,IAAI,CAAC,QAAQ,KAAK,SAAS;cACxB,EAAE;cACF,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,KACrB,WAAK,KAAK,EAAC,OAAO,IAChB,UAAI,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAC,gBAAgB,IACpE,KAAK,CAAC,OAAO,EACd,YAAM,KAAK,EAAC,OAAO,IACjB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAC,OAAO,EAAC,UAAU,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC1F,YAAM,CAAC,EAAC,oDAAoD,EAAC,MAAM,EAAC,OAAO,kBAAc,GAAG,GAAG,CAC3F,CACD,CACJ,EACL,WAAK,KAAK,EAAC,SAAS,EAAC,SAAS,EAAE,KAAK,CAAC,SAAS,GAAQ,CACnD,CACP,CAAC,CACF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveAccordion"],"sources":["src/components/biggive-accordion/biggive-accordion.scss?tag=biggive-accordion&encapsulation=shadow","src/components/biggive-accordion/biggive-accordion.tsx"],"sourcesContent":["@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n\n\n .entry {\n h3.heading {\n position: relative;\n margin: 25px 0 0 0;\n padding: 15px 60px 10px 20px;\n border-bottom: 1px solid $colour-black;\n cursor: pointer;\n span.arrow {\n display: block;\n position: absolute;\n right: 20px;\n top: 10px;\n width: 40px;\n height: 20px;\n text-align: center;\n }\n }\n .content {\n overflow: hidden;\n max-height: 0;\n padding: 0 20px;\n }\n &.expanded {\n .content {\n max-height: 100%;\n }\n span.arrow {\n transform: rotate(-180deg);\n }\n }\n }\n\n @each $key, $colour in $brandColoursIncBrand6Turquoise {\n &.heading-colour-#{$key} .entry h3.heading svg path { stroke: $colour; }\n &.heading-colour-#{$key} h3.heading { color: $colour; }\n &.text-colour-#{$key} .content { color: $colour; }\n }\n\n\n}\n\n\n","import { Component, Element, h, Prop, State } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-accordion',\n styleUrl: 'biggive-accordion.scss',\n shadow: true,\n})\nexport class BiggiveAccordion {\n @Element() host: HTMLBiggiveAccordionElement;\n\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() headingColour: brandColour = 'primary';\n\n @State() children: Array<HTMLBiggiveAccordionEntryElement>;\n\n componentWillLoad() {\n this.children = Array.from(this.host.children) as Array<HTMLBiggiveAccordionEntryElement>;\n }\n\n private toggleSection(e: MouseEvent) {\n const target = (e.target as Element)!;\n const entry = target.closest('.entry')!;\n const arrow = entry.querySelector('.arrow')!;\n\n if (entry.classList.contains('expanded')) {\n entry.classList.remove('expanded');\n arrow.setAttribute('title', 'Expand section');\n } else {\n entry.classList.add('expanded');\n arrow.setAttribute('title', 'Collapse section');\n }\n }\n\n render() {\n return (\n <div class={'container' + ' space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' heading-colour-' + this.headingColour}>\n <div class=\"sleeve\">\n {this.children === undefined\n ? []\n : this.children.map(entry => (\n <div class=\"entry\">\n <h3 class=\"heading\" onClick={this.toggleSection} title=\"Expand section\">\n {entry.heading}\n <span class=\"arrow\">\n <svg width=\"15\" height=\"9\" viewBox=\"0 0 15 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M14.1074 0.999859L7.55357 7.55371L0.999718 0.99986\" stroke=\"black\" stroke-width=\"2\" />\n </svg>\n </span>\n </h3>\n <div class=\"content\" innerHTML={entry.innerHTML}></div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-article-card.js CHANGED Viewed

@@ -33,7 +33,7 @@ const BiggiveArticleCard$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveArtic
         this.clipTopRightCorner = true;
     }
     render() {
-        return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: 'sleeve background-colour-' +
+        return (h("div", { key: '5335509dd674ea60650fc1c1cba5dac3409c9457', class: 'container space-below-' + this.spaceBelow }, h("div", { key: '497197b96c3dcfd40b8bfa9546ac17c67112cd54', class: 'sleeve background-colour-' +
                 this.backgroundColour +
                 ' text-colour-black ' +
                 ' slug-colour-' +
@@ -49,7 +49,7 @@ const BiggiveArticleCard$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveArtic
                 ' clip-bottom-left-corner-' +
                 this.clipBottomLeftCorner +
                 ' clip-top-right-corner-' +
-                this.clipTopRightCorner, style: { 'background-image': "url('" + this.backgroundImageUrl + "')" } }, h("div", { class: "content-wrap" }, h("div", { class: "meta" }, this.slug != '' ? h("div", { class: "slug text-colour-primary" }, this.slug) : null, this.date != '' ? h("div", { class: "date" }, this.date) : null), this.mainImageUrl != '' ? (h("div", { class: "main-image-container" }, h("div", { class: "image-wrap" }, h("img", { src: this.mainImageUrl, alt: this.mainImageAltText })))) : null, h("h3", { class: "title" }, h("a", { href: this.buttonUrl }, this.mainTitle)), this.image1Url != '' || this.image2Url != '' ? (h("div", { class: "image-group" }, this.image1Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image1Url + "')" } }, h("img", { src: this.image1Url, alt: this.image1AltText })))) : null, this.image2Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image2Url + "')" } }, h("img", { src: this.image2Url, alt: this.image2AltText })))) : null)) : null, this.imageLabel != '' ? h("div", { class: "image-label" }, this.imageLabel) : null, this.buttonLabel != null && this.buttonUrl != null ? (h("div", { class: "button-wrap align-right" }, h("biggive-button", { "colour-scheme": 'clear-' + this.buttonColour, url: this.buttonUrl, label: this.buttonLabel }))) : null))));
+                this.clipTopRightCorner, style: { 'background-image': "url('" + this.backgroundImageUrl + "')" } }, h("div", { key: 'e02a55a2b94147be042fce8de85c218df414145d', class: "content-wrap" }, h("div", { key: '95485ea8d086b5f9816dfb263e7ad3593c908d8a', class: "meta" }, this.slug != '' ? h("div", { class: "slug text-colour-primary" }, this.slug) : null, this.date != '' ? h("div", { class: "date" }, this.date) : null), this.mainImageUrl != '' ? (h("div", { class: "main-image-container" }, h("div", { class: "image-wrap" }, h("img", { src: this.mainImageUrl, alt: this.mainImageAltText })))) : null, h("h3", { key: 'ce2448ed0e40e16d83dd17acf093713f7b412045', class: "title" }, h("a", { key: '23f8349570f850182064a2b34a74014f1e02fdd9', href: this.buttonUrl }, this.mainTitle)), this.image1Url != '' || this.image2Url != '' ? (h("div", { class: "image-group" }, this.image1Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image1Url + "')" } }, h("img", { src: this.image1Url, alt: this.image1AltText })))) : null, this.image2Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image2Url + "')" } }, h("img", { src: this.image2Url, alt: this.image2AltText })))) : null)) : null, this.imageLabel != '' ? h("div", { class: "image-label" }, this.imageLabel) : null, this.buttonLabel != null && this.buttonUrl != null ? (h("div", { class: "button-wrap align-right" }, h("biggive-button", { "colour-scheme": 'clear-' + this.buttonColour, url: this.buttonUrl, label: this.buttonLabel }))) : null))));
     }
     static get style() { return BiggiveArticleCardStyle0; }
 }, [1, "biggive-article-card", {

package/dist/components/biggive-article-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-article-card.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,ggXAAggX,CAAC;AAC/hX,iCAAe,qBAAqB;;MCQvBA,oBAAkB;;;;;0BACO,CAAC;gCAEG,OAAO;kCAEV,EAAE;;0BAIL,OAAO;;0BAIP,OAAO;;+BAIF,OAAO;;;;;;;;gCAgBN,OAAO;;;4BAMX,OAAO;oCAEH,IAAI;kCAEN,IAAI;;IAE1C,MAAM;QACJ,QACE,~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,IACpD,~~WACE~~,KAAK,EACH,2BAA2B;gBAC3B,IAAI,CAAC,gBAAgB;gBACrB,qBAAqB;gBACrB,eAAe;gBACf,IAAI,CAAC,UAAU;gBACf,eAAe;gBACf,IAAI,CAAC,UAAU;gBACf,qBAAqB;gBACrB,IAAI,CAAC,eAAe;gBACpB,sBAAsB;gBACtB,IAAI,CAAC,gBAAgB;gBACrB,gBAAgB;gBAChB,IAAI,CAAC,YAAY;gBACjB,2BAA2B;gBAC3B,IAAI,CAAC,oBAAoB;gBACzB,yBAAyB;gBACzB,IAAI,CAAC,kBAAkB,EAEzB,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,kBAAkB,GAAG,IAAI,EAAE,IAEvE,~~WAAK~~,KAAK,EAAC,cAAc,IACvB,~~WAAK~~,KAAK,EAAC,MAAM,IACd,IAAI,CAAC,IAAI,IAAI,EAAE,GAAG,WAAK,KAAK,EAAC,0BAA0B,IAAE,IAAI,CAAC,IAAI,CAAO,GAAG,IAAI,EAChF,IAAI,CAAC,IAAI,IAAI,EAAE,GAAG,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAO,GAAG,IAAI,CACzD,EAEL,IAAI,CAAC,YAAY,IAAI,EAAE,IACtB,WAAK,KAAK,EAAC,sBAAsB,IAC/B,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,gBAAgB,GAAI,CACvD,CACF,IACJ,IAAI,EAER,~~UAAI~~,KAAK,EAAC,OAAO,IACf,~~SAAG~~,IAAI,EAAE,IAAI,CAAC,SAAS,IAAG,IAAI,CAAC,SAAS,CAAK,CAC1C,EACJ,IAAI,CAAC,SAAS,IAAI,EAAE,IAAI,IAAI,CAAC,SAAS,IAAI,EAAE,IAC3C,WAAK,KAAK,EAAC,aAAa,IACrB,IAAI,CAAC,SAAS,IAAI,EAAE,IACnB,WAAK,KAAK,EAAC,iBAAiB,IAC1B,WAAK,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,EAAE,IACpF,WAAK,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,aAAa,GAAI,CACjD,CACF,IACJ,IAAI,EAEP,IAAI,CAAC,SAAS,IAAI,EAAE,IACnB,WAAK,KAAK,EAAC,iBAAiB,IAC1B,WAAK,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,EAAE,IACpF,WAAK,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,aAAa,GAAI,CACjD,CACF,IACJ,IAAI,CACJ,IACJ,IAAI,EAEP,IAAI,CAAC,UAAU,IAAI,EAAE,GAAG,WAAK,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,UAAU,CAAO,GAAG,IAAI,EAE/E,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,IACjD,WAAK,KAAK,EAAC,yBAAyB,IAClC,uCAA+B,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GAAmB,CACxH,IACJ,IAAI,CACJ,CACF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveArticleCard"],"sources":["src/components/biggive-article-card/biggive-article-card.scss?tag=biggive-article-card&encapsulation=shadow","src/components/biggive-article-card/biggive-article-card.tsx"],"sourcesContent":["@include backgrounds();\n@include image-alignment();\n@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.align-right {\n text-align: right;\n}\n\n.container {\n height: 100%;\n width: 100%;\n @include standard-font();\n position: relative;\n text-align: left;\n @include lower-shadow();\n .sleeve {\n height: 100%;\n box-sizing: border-box;\n background-size: cover;\n padding: $spacer-3 $spacer-3 $spacer-2 $spacer-3;\n .content-wrap {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n }\n .meta {\n margin-bottom: $spacer-2;\n }\n .meta .slug {\n @include font-size-small();\n margin-bottom: $spacer-1;\n }\n .meta .date {\n @include font-size-small();\n margin-bottom: $spacer-1;\n }\n h3 {\n @include heading-4();\n padding-bottom: $spacer-3;\n margin-bottom: auto;\n a,\n a:hover {\n text-decoration: none;\n }\n }\n .main-image-container {\n img {\n width: 100%;\n height: auto;\n display: inline-block;\n }\n }\n .image-group {\n display: flex;\n margin-bottom: $spacer-3;\n .image-container {\n margin-right: 15px;\n .image-wrap {\n border-radius: 50%;\n width: 60px;\n height: 60px;\n background-size: cover;\n background-position: center center;\n margin-bottom: $spacer-1;\n img {\n display: none;\n }\n }\n }\n }\n .image-label {\n @include font-size-x-small();\n }\n\n\n .clip-bottom-left-corner-false.clip-top-right-corner-true {\n \n @include corner-clip-medium-top-right();\n \n }\n .clip-bottom-left-corner-true.clip-top-right-corner-false {\n @include corner-clip-medium-bottom-left();\n }\n \n .clip-bottom-left-corner-true.clip-top-right-corner-true {\n @include corner-clip-medium-bottom-left-top-right();\n \n }\n\n \n\n @each $key, $colour in $brandColoursIncBrand6Turquoise {\n .main-title-colour-#{$key} h3 { color: $colour; }\n .slug-colour-#{$key} .slug { color: $colour; }\n .date-colour-#{$key} .date { color: $colour; }\n .image-label-colour-#{$key} .image-label { color: $colour; }\n }\n \n \n \n\n\n}","import { Component, Prop, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-article-card',\n styleUrl: 'biggive-article-card.scss',\n shadow: true,\n})\nexport class BiggiveArticleCard {\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() backgroundColour: brandColour = 'white';\n\n @Prop() backgroundImageUrl: string = '';\n\n @Prop() slug: string;\n\n @Prop() slugColour: brandColour = 'black';\n\n @Prop() date: string;\n\n @Prop() dateColour: brandColour = 'black';\n\n @Prop() mainTitle: string;\n\n @Prop() mainTitleColour: brandColour = 'black';\n\n @Prop() mainImageUrl: string;\n\n @Prop() mainImageAltText: string;\n\n @Prop() image1Url: string;\n\n @Prop() image1AltText: string;\n\n @Prop() image2Url: string;\n\n @Prop() image2AltText: string;\n\n @Prop() imageLabel: string;\n\n @Prop() imageLabelColour: brandColour = 'black';\n\n @Prop() buttonLabel: string;\n\n @Prop() buttonUrl: string;\n\n @Prop() buttonColour: brandColour = 'black';\n\n @Prop() clipBottomLeftCorner: boolean = true;\n\n @Prop() clipTopRightCorner: boolean = true;\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n <div\n class={\n 'sleeve background-colour-' +\n this.backgroundColour +\n ' text-colour-black ' +\n ' slug-colour-' +\n this.slugColour +\n ' date-colour-' +\n this.dateColour +\n ' main-title-colour-' +\n this.mainTitleColour +\n ' image-label-colour-' +\n this.imageLabelColour +\n ' button-colour' +\n this.buttonColour +\n ' clip-bottom-left-corner-' +\n this.clipBottomLeftCorner +\n ' clip-top-right-corner-' +\n this.clipTopRightCorner\n }\n style={{ 'background-image': \"url('\" + this.backgroundImageUrl + \"')\" }}\n >\n <div class=\"content-wrap\">\n <div class=\"meta\">\n {this.slug != '' ? <div class=\"slug text-colour-primary\">{this.slug}</div> : null}\n {this.date != '' ? <div class=\"date\">{this.date}</div> : null}\n </div>\n\n {this.mainImageUrl != '' ? (\n <div class=\"main-image-container\">\n <div class=\"image-wrap\">\n <img src={this.mainImageUrl} alt={this.mainImageAltText} />\n </div>\n </div>\n ) : null}\n\n <h3 class=\"title\">\n <a href={this.buttonUrl}>{this.mainTitle}</a>\n </h3>\n {this.image1Url != '' \|\| this.image2Url != '' ? (\n <div class=\"image-group\">\n {this.image1Url != '' ? (\n <div class=\"image-container\">\n <div class=\"image-wrap\" style={{ 'background-image': \"url('\" + this.image1Url + \"')\" }}>\n <img src={this.image1Url} alt={this.image1AltText} />\n </div>\n </div>\n ) : null}\n\n {this.image2Url != '' ? (\n <div class=\"image-container\">\n <div class=\"image-wrap\" style={{ 'background-image': \"url('\" + this.image2Url + \"')\" }}>\n <img src={this.image2Url} alt={this.image2AltText} />\n </div>\n </div>\n ) : null}\n </div>\n ) : null}\n\n {this.imageLabel != '' ? <div class=\"image-label\">{this.imageLabel}</div> : null}\n\n {this.buttonLabel != null && this.buttonUrl != null ? (\n <div class=\"button-wrap align-right\">\n <biggive-button colour-scheme={'clear-' + this.buttonColour} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n </div>\n ) : null}\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-article-card.js","mappings":"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","names":["BiggiveArticleCard"],"sources":["src/components/biggive-article-card/biggive-article-card.scss?tag=biggive-article-card&encapsulation=shadow","src/components/biggive-article-card/biggive-article-card.tsx"],"sourcesContent":["@include backgrounds();\n@include image-alignment();\n@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.align-right {\n text-align: right;\n}\n\n.container {\n height: 100%;\n width: 100%;\n @include standard-font();\n position: relative;\n text-align: left;\n @include lower-shadow();\n .sleeve {\n height: 100%;\n box-sizing: border-box;\n background-size: cover;\n padding: $spacer-3 $spacer-3 $spacer-2 $spacer-3;\n .content-wrap {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n }\n .meta {\n margin-bottom: $spacer-2;\n }\n .meta .slug {\n @include font-size-small();\n margin-bottom: $spacer-1;\n }\n .meta .date {\n @include font-size-small();\n margin-bottom: $spacer-1;\n }\n h3 {\n @include heading-4();\n padding-bottom: $spacer-3;\n margin-bottom: auto;\n a,\n a:hover {\n text-decoration: none;\n }\n }\n .main-image-container {\n img {\n width: 100%;\n height: auto;\n display: inline-block;\n }\n }\n .image-group {\n display: flex;\n margin-bottom: $spacer-3;\n .image-container {\n margin-right: 15px;\n .image-wrap {\n border-radius: 50%;\n width: 60px;\n height: 60px;\n background-size: cover;\n background-position: center center;\n margin-bottom: $spacer-1;\n img {\n display: none;\n }\n }\n }\n }\n .image-label {\n @include font-size-x-small();\n }\n\n\n .clip-bottom-left-corner-false.clip-top-right-corner-true {\n \n @include corner-clip-medium-top-right();\n \n }\n .clip-bottom-left-corner-true.clip-top-right-corner-false {\n @include corner-clip-medium-bottom-left();\n }\n \n .clip-bottom-left-corner-true.clip-top-right-corner-true {\n @include corner-clip-medium-bottom-left-top-right();\n \n }\n\n \n\n @each $key, $colour in $brandColoursIncBrand6Turquoise {\n .main-title-colour-#{$key} h3 { color: $colour; }\n .slug-colour-#{$key} .slug { color: $colour; }\n .date-colour-#{$key} .date { color: $colour; }\n .image-label-colour-#{$key} .image-label { color: $colour; }\n }\n \n \n \n\n\n}","import { Component, Prop, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-article-card',\n styleUrl: 'biggive-article-card.scss',\n shadow: true,\n})\nexport class BiggiveArticleCard {\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() backgroundColour: brandColour = 'white';\n\n @Prop() backgroundImageUrl: string = '';\n\n @Prop() slug: string;\n\n @Prop() slugColour: brandColour = 'black';\n\n @Prop() date: string;\n\n @Prop() dateColour: brandColour = 'black';\n\n @Prop() mainTitle: string;\n\n @Prop() mainTitleColour: brandColour = 'black';\n\n @Prop() mainImageUrl: string;\n\n @Prop() mainImageAltText: string;\n\n @Prop() image1Url: string;\n\n @Prop() image1AltText: string;\n\n @Prop() image2Url: string;\n\n @Prop() image2AltText: string;\n\n @Prop() imageLabel: string;\n\n @Prop() imageLabelColour: brandColour = 'black';\n\n @Prop() buttonLabel: string;\n\n @Prop() buttonUrl: string;\n\n @Prop() buttonColour: brandColour = 'black';\n\n @Prop() clipBottomLeftCorner: boolean = true;\n\n @Prop() clipTopRightCorner: boolean = true;\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n <div\n class={\n 'sleeve background-colour-' +\n this.backgroundColour +\n ' text-colour-black ' +\n ' slug-colour-' +\n this.slugColour +\n ' date-colour-' +\n this.dateColour +\n ' main-title-colour-' +\n this.mainTitleColour +\n ' image-label-colour-' +\n this.imageLabelColour +\n ' button-colour' +\n this.buttonColour +\n ' clip-bottom-left-corner-' +\n this.clipBottomLeftCorner +\n ' clip-top-right-corner-' +\n this.clipTopRightCorner\n }\n style={{ 'background-image': \"url('\" + this.backgroundImageUrl + \"')\" }}\n >\n <div class=\"content-wrap\">\n <div class=\"meta\">\n {this.slug != '' ? <div class=\"slug text-colour-primary\">{this.slug}</div> : null}\n {this.date != '' ? <div class=\"date\">{this.date}</div> : null}\n </div>\n\n {this.mainImageUrl != '' ? (\n <div class=\"main-image-container\">\n <div class=\"image-wrap\">\n <img src={this.mainImageUrl} alt={this.mainImageAltText} />\n </div>\n </div>\n ) : null}\n\n <h3 class=\"title\">\n <a href={this.buttonUrl}>{this.mainTitle}</a>\n </h3>\n {this.image1Url != '' \|\| this.image2Url != '' ? (\n <div class=\"image-group\">\n {this.image1Url != '' ? (\n <div class=\"image-container\">\n <div class=\"image-wrap\" style={{ 'background-image': \"url('\" + this.image1Url + \"')\" }}>\n <img src={this.image1Url} alt={this.image1AltText} />\n </div>\n </div>\n ) : null}\n\n {this.image2Url != '' ? (\n <div class=\"image-container\">\n <div class=\"image-wrap\" style={{ 'background-image': \"url('\" + this.image2Url + \"')\" }}>\n <img src={this.image2Url} alt={this.image2AltText} />\n </div>\n </div>\n ) : null}\n </div>\n ) : null}\n\n {this.imageLabel != '' ? <div class=\"image-label\">{this.imageLabel}</div> : null}\n\n {this.buttonLabel != null && this.buttonUrl != null ? (\n <div class=\"button-wrap align-right\">\n <biggive-button colour-scheme={'clear-' + this.buttonColour} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n </div>\n ) : null}\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-back-to-top.js CHANGED Viewed

@@ -10,7 +10,7 @@ const BiggiveBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBackToT
         this.__attachShadow();
     }
     render() {
-        return (h("div", { class: "container" }, h("a", { href: "#" }, h("img", { src: getAssetPath('assets/images/triangles-combined.svg') }), h("span", { class: "text" }, "Back to top"))));
+        return (h("div", { key: '8dddc9acaa44d83d4443cca0541b4384713f4633', class: "container" }, h("a", { key: 'e5cbb847bedc6cbcd781c185d38dcd9560577c45', href: "#" }, h("img", { key: '22dc0f1d222df7f2508eee40fc64df5c21e3e9ed', src: getAssetPath('assets/images/triangles-combined.svg') }), h("span", { key: 'fde2f491296cb56670ab2f37b880995225f33e43', class: "text" }, "Back to top"))));
     }
     static get style() { return BiggiveBackToTopStyle0; }
 }, [1, "biggive-back-to-top"]);

package/dist/components/biggive-back-to-top.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-back-to-top.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,0RAA0R,CAAC;AACvT,+BAAe,mBAAmB;;MCMrBA,kBAAgB;;;;;;IAC3B,MAAM;QACJ,QACE,~~WAAK~~,KAAK,EAAC,WAAW,IACpB,~~SAAG~~,IAAI,EAAC,GAAG,IACT,~~WAAK~~,GAAG,EAAE,YAAY,CAAC,sCAAsC,CAAC,GAAI,EAClE,~~YAAM~~,KAAK,EAAC,MAAM,kBAAmB,CACnC,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBackToTop"],"sources":["src/components/biggive-back-to-top/biggive-back-to-top.scss?tag=biggive-back-to-top&encapsulation=shadow","src/components/biggive-back-to-top/biggive-back-to-top.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n\n.container {\n @include standard-font();\n margin: $spacer-4 0;\n text-align: center;\n a {\n display: inline-block;\n .text {\n display: block;\n }\n }\n}","import { Component, getAssetPath, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-back-to-top',\n styleUrl: 'biggive-back-to-top.scss',\n shadow: true,\n})\nexport class BiggiveBackToTop {\n render() {\n return (\n <div class=\"container\">\n <a href=\"#\">\n <img src={getAssetPath('assets/images/triangles-combined.svg')} />\n <span class=\"text\">Back to top</span>\n </a>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-back-to-top.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,0RAA0R,CAAC;AACvT,+BAAe,mBAAmB;;MCMrBA,kBAAgB;;;;;;IAC3B,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,WAAW,IACpB,0DAAG,IAAI,EAAC,GAAG,IACT,4DAAK,GAAG,EAAE,YAAY,CAAC,sCAAsC,CAAC,GAAI,EAClE,6DAAM,KAAK,EAAC,MAAM,kBAAmB,CACnC,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBackToTop"],"sources":["src/components/biggive-back-to-top/biggive-back-to-top.scss?tag=biggive-back-to-top&encapsulation=shadow","src/components/biggive-back-to-top/biggive-back-to-top.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n\n.container {\n @include standard-font();\n margin: $spacer-4 0;\n text-align: center;\n a {\n display: inline-block;\n .text {\n display: block;\n }\n }\n}","import { Component, getAssetPath, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-back-to-top',\n styleUrl: 'biggive-back-to-top.scss',\n shadow: true,\n})\nexport class BiggiveBackToTop {\n render() {\n return (\n <div class=\"container\">\n <a href=\"#\">\n <img src={getAssetPath('assets/images/triangles-combined.svg')} />\n <span class=\"text\">Back to top</span>\n </a>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-basic-card.js CHANGED Viewed

@@ -33,7 +33,7 @@ const BiggiveBasicCard$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBasicCa
     }
     render() {
         const HeadingTag = `h${this.headingLevel}`;
-        return (h("div", { class: 'container space-below-' +
+        return (h("div", { key: 'e2845d8a967604cc97a24dae26893c86ee05ca5f', class: 'container space-below-' +
                 this.spaceBelow +
                 ' background-colour-' +
                 this.backgroundColour +
@@ -42,7 +42,7 @@ const BiggiveBasicCard$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBasicCa
                 ' clip-top-right-corner-' +
                 this.clipTopRightCorner +
                 ' add-animation-' +
-                this.addAnimation, style: { 'background-image': "url('" + this.backgroundImageUrl + "')" } }, h("a", { href: this.buttonUrl }, h("div", { class: 'sleeve background-colour-' + this.cardColour + ' text-colour-' + this.textColour }, h("div", { class: "content-wrap" }, this.icon == true ? (h("div", { class: "icon" }, h("svg", { width: "53", height: "39", viewBox: "0 0 53 39", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M38.7009 13.6572L52.3535 38.6959H25.0386L38.7009 13.6572Z", class: "fill-black" }), h("path", { d: "M20.4789 36.4199L6.36785e-06 5.89713e-05L40.9724 6.61352e-05L20.4789 36.4199Z", class: 'fill-' + this.iconColour })))) : null, this.mainImageUrl != '' ? (h("div", { class: "main-image-container" }, h("div", { class: "image-wrap" }, h("img", { src: this.mainImageUrl, alt: this.mainImageAltText, title: this.mainImageAltText })))) : null, h(HeadingTag, { class: "title" }, this.mainTitle), h("div", { class: "subtitle" }, this.subtitle), h("div", { class: "teaser" }, this.teaser), this.buttonLabel != null && this.buttonUrl != null && this.buttonUrl != '' ? (h("div", { class: 'button-wrap align-' + this.buttonAlign }, h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel }))) : null)))));
+                this.addAnimation, style: { 'background-image': "url('" + this.backgroundImageUrl + "')" } }, h("a", { key: '970ae918ea3554bc577708280c839eaa506c8cb0', href: this.buttonUrl }, h("div", { key: '7d4f3e9ebc683c50c3aa025aa0e71e56ccfb8bce', class: 'sleeve background-colour-' + this.cardColour + ' text-colour-' + this.textColour }, h("div", { key: '671b23834d802a9995077f3af7956a2ab2dd5f84', class: "content-wrap" }, this.icon == true ? (h("div", { class: "icon" }, h("svg", { width: "53", height: "39", viewBox: "0 0 53 39", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M38.7009 13.6572L52.3535 38.6959H25.0386L38.7009 13.6572Z", class: "fill-black" }), h("path", { d: "M20.4789 36.4199L6.36785e-06 5.89713e-05L40.9724 6.61352e-05L20.4789 36.4199Z", class: 'fill-' + this.iconColour })))) : null, this.mainImageUrl != '' ? (h("div", { class: "main-image-container" }, h("div", { class: "image-wrap" }, h("img", { src: this.mainImageUrl, alt: this.mainImageAltText, title: this.mainImageAltText })))) : null, h(HeadingTag, { key: '9c45c6f167bbfb3a7264d016ff10ad5c5a027c6e', class: "title" }, this.mainTitle), h("div", { key: 'cd99e6157174f18756816af6497152416cede8b3', class: "subtitle" }, this.subtitle), h("div", { key: 'dd804e05abfbd5e6bfbe00fc8c5b7c7c79baca29', class: "teaser" }, this.teaser), this.buttonLabel != null && this.buttonUrl != null && this.buttonUrl != '' ? (h("div", { class: 'button-wrap align-' + this.buttonAlign }, h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel }))) : null)))));
     }
     static get style() { return BiggiveBasicCardStyle0; }
 }, [1, "biggive-basic-card", {

package/dist/components/biggive-basic-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-basic-card.js","mappings":";;;AAAA,MAAM,mBAAmB,GAAG,+gNAA+gN,CAAC;AAC5iN,+BAAe,mBAAmB;;MCQrBA,kBAAgB;;;;;0BACS,CAAC;gCAEG,SAAS;kCAEZ,EAAE;0BAEL,OAAO;0BAEP,OAAO;;;;;;oBAYjB,IAAI;0BAEM,SAAS;2BAEb,QAAQ;2BAER,UAAU;;;kCAMH,eAAe;oCAEZ,IAAI;kCAEN,IAAI;4BAEI,CAAC;4BAEf,KAAK;;IAErC,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;QAE3C,QACE,~~WACE~~,KAAK,EACH,wBAAwB;gBACxB,IAAI,CAAC,UAAU;gBACf,qBAAqB;gBACrB,IAAI,CAAC,gBAAgB;gBACrB,2BAA2B;gBAC3B,IAAI,CAAC,oBAAoB;gBACzB,yBAAyB;gBACzB,IAAI,CAAC,kBAAkB;gBACvB,iBAAiB;gBACjB,IAAI,CAAC,YAAY,EAEnB,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,kBAAkB,GAAG,IAAI,EAAE,IAEvE,~~SAAG~~,IAAI,EAAE,IAAI,CAAC,SAAS,IACrB,~~WAAK~~,KAAK,EAAE,2BAA2B,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,IAC3F,~~WAAK~~,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,IAAI,IAAI,IAAI,IAChB,WAAK,KAAK,EAAC,MAAM,IACf,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5F,YAAM,CAAC,EAAC,2DAA2D,EAAC,KAAK,EAAC,YAAY,GAAG,EACzF,YAAM,CAAC,EAAC,+EAA+E,EAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC,UAAU,GAAI,CACxH,CACF,IACJ,IAAI,EACP,IAAI,CAAC,YAAY,IAAI,EAAE,IACtB,WAAK,KAAK,EAAC,sBAAsB,IAC/B,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,gBAAgB,GAAI,CACrF,CACF,IACJ,IAAI,EACR,EAAC,UAAU,~~IAAC~~,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,SAAS,CAAc,EACvD,~~WAAK~~,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,QAAQ,CAAO,EAC3C,~~WAAK~~,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,MAAM,CAAO,EACtC,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,EAAE,IACzE,WAAK,KAAK,EAAE,oBAAoB,GAAG,IAAI,CAAC,WAAW,IACjD,uCAA+B,IAAI,CAAC,kBAAkB,EAAE,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GAAmB,CACnH,IACJ,IAAI,CACJ,CACF,CACJ,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBasicCard"],"sources":["src/components/biggive-basic-card/biggive-basic-card.scss?tag=biggive-basic-card&encapsulation=shadow","src/components/biggive-basic-card/biggive-basic-card.tsx"],"sourcesContent":["@include backgrounds();\n@include fills();\n@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n text-align: center;\n background-size: cover;\n background-position: center center;\n padding: $spacer-4;\n height: 100%;\n white-space: pre-wrap;\n a,\n a:hover {\n text-decoration: none;\n }\n .sleeve {\n padding: $spacer-4;\n height: 100%;\n box-sizing: border-box;\n transition: all 1s ease-in-out;\n }\n &.add-animation-true:hover .sleeve {\n margin: -30px;\n padding: 60px;\n height: calc(100% + 60px);\n }\n &.clip-bottom-left-corner-false.clip-top-right-corner-true {\n .sleeve {\n @include corner-clip-medium-top-right();\n }\n }\n &.clip-bottom-left-corner-true.clip-top-right-corner-false {\n .sleeve {\n @include corner-clip-medium-bottom-left();\n }\n }\n &.clip-bottom-left-corner-true.clip-top-right-corner-true {\n .sleeve {\n @include corner-clip-medium-bottom-left-top-right();\n }\n }\n\n .icon {\n svg {\n width: 50px;\n height: auto;\n }\n }\n .title {\n // these have to be the heading level passed in based on order of headings, but in terms of design we want it look like H3.\n @include heading-3();\n margin-bottom: $spacer-3;\n }\n .subtitle {\n margin-bottom: $spacer-3;\n }\n .main-image-container {\n margin-bottom: 15px;\n img {\n width: 100%;\n height: auto;\n }\n }\n .button-wrap {\n text-align: center;\n &.align-left {\n text-align: left;\n }\n &.align-right {\n text-align: right;\n }\n }\n\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-basic-card',\n styleUrl: 'biggive-basic-card.scss',\n shadow: true,\n})\nexport class BiggiveBasicCard {\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() backgroundColour: brandColour = 'primary';\n\n @Prop() backgroundImageUrl: string = '';\n\n @Prop() cardColour: brandColour = 'white';\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() mainImageUrl: string;\n\n @Prop() mainImageAltText: string;\n\n @Prop() mainTitle: string;\n\n @Prop() subtitle: string;\n\n @Prop() teaser: string;\n\n @Prop() icon: boolean = true;\n\n @Prop() iconColour: brandColour = 'primary';\n\n @Prop() buttonAlign: string = 'center';\n\n @Prop() buttonStyle: string = 'standard';\n\n @Prop() buttonLabel: string;\n\n @Prop() buttonUrl: string;\n\n @Prop() buttonColourScheme: string = 'clear-primary';\n\n @Prop() clipBottomLeftCorner: boolean = true;\n\n @Prop() clipTopRightCorner: boolean = true;\n\n @Prop() headingLevel: 1 \| 2 \| 3 \| 4 \| 5 \| 6 = 3;\n\n @Prop() addAnimation: boolean = false;\n\n render() {\n const HeadingTag = `h${this.headingLevel}`;\n\n return (\n <div\n class={\n 'container space-below-' +\n this.spaceBelow +\n ' background-colour-' +\n this.backgroundColour +\n ' clip-bottom-left-corner-' +\n this.clipBottomLeftCorner +\n ' clip-top-right-corner-' +\n this.clipTopRightCorner +\n ' add-animation-' +\n this.addAnimation\n }\n style={{ 'background-image': \"url('\" + this.backgroundImageUrl + \"')\" }}\n >\n <a href={this.buttonUrl}>\n <div class={'sleeve background-colour-' + this.cardColour + ' text-colour-' + this.textColour}>\n <div class=\"content-wrap\">\n {this.icon == true ? (\n <div class=\"icon\">\n <svg width=\"53\" height=\"39\" viewBox=\"0 0 53 39\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M38.7009 13.6572L52.3535 38.6959H25.0386L38.7009 13.6572Z\" class=\"fill-black\" />\n <path d=\"M20.4789 36.4199L6.36785e-06 5.89713e-05L40.9724 6.61352e-05L20.4789 36.4199Z\" class={'fill-' + this.iconColour} />\n </svg>\n </div>\n ) : null}\n {this.mainImageUrl != '' ? (\n <div class=\"main-image-container\">\n <div class=\"image-wrap\">\n <img src={this.mainImageUrl} alt={this.mainImageAltText} title={this.mainImageAltText} />\n </div>\n </div>\n ) : null}\n <HeadingTag class=\"title\">{this.mainTitle}</HeadingTag>\n <div class=\"subtitle\">{this.subtitle}</div>\n <div class=\"teaser\">{this.teaser}</div>\n {this.buttonLabel != null && this.buttonUrl != null && this.buttonUrl != '' ? (\n <div class={'button-wrap align-' + this.buttonAlign}>\n <biggive-button colour-scheme={this.buttonColourScheme} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n </div>\n ) : null}\n </div>\n </div>\n </a>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-basic-card.js","mappings":";;;AAAA,MAAM,mBAAmB,GAAG,+gNAA+gN,CAAC;AAC5iN,+BAAe,mBAAmB;;MCQrBA,kBAAgB;;;;;0BACS,CAAC;gCAEG,SAAS;kCAEZ,EAAE;0BAEL,OAAO;0BAEP,OAAO;;;;;;oBAYjB,IAAI;0BAEM,SAAS;2BAEb,QAAQ;2BAER,UAAU;;;kCAMH,eAAe;oCAEZ,IAAI;kCAEN,IAAI;4BAEI,CAAC;4BAEf,KAAK;;IAErC,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;QAE3C,QACE,4DACE,KAAK,EACH,wBAAwB;gBACxB,IAAI,CAAC,UAAU;gBACf,qBAAqB;gBACrB,IAAI,CAAC,gBAAgB;gBACrB,2BAA2B;gBAC3B,IAAI,CAAC,oBAAoB;gBACzB,yBAAyB;gBACzB,IAAI,CAAC,kBAAkB;gBACvB,iBAAiB;gBACjB,IAAI,CAAC,YAAY,EAEnB,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,kBAAkB,GAAG,IAAI,EAAE,IAEvE,0DAAG,IAAI,EAAE,IAAI,CAAC,SAAS,IACrB,4DAAK,KAAK,EAAE,2BAA2B,GAAG,IAAI,CAAC,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC,UAAU,IAC3F,4DAAK,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,IAAI,IAAI,IAAI,IAChB,WAAK,KAAK,EAAC,MAAM,IACf,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5F,YAAM,CAAC,EAAC,2DAA2D,EAAC,KAAK,EAAC,YAAY,GAAG,EACzF,YAAM,CAAC,EAAC,+EAA+E,EAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC,UAAU,GAAI,CACxH,CACF,IACJ,IAAI,EACP,IAAI,CAAC,YAAY,IAAI,EAAE,IACtB,WAAK,KAAK,EAAC,sBAAsB,IAC/B,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,gBAAgB,GAAI,CACrF,CACF,IACJ,IAAI,EACR,EAAC,UAAU,qDAAC,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,SAAS,CAAc,EACvD,4DAAK,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,QAAQ,CAAO,EAC3C,4DAAK,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,MAAM,CAAO,EACtC,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,IAAI,EAAE,IACzE,WAAK,KAAK,EAAE,oBAAoB,GAAG,IAAI,CAAC,WAAW,IACjD,uCAA+B,IAAI,CAAC,kBAAkB,EAAE,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,GAAmB,CACnH,IACJ,IAAI,CACJ,CACF,CACJ,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBasicCard"],"sources":["src/components/biggive-basic-card/biggive-basic-card.scss?tag=biggive-basic-card&encapsulation=shadow","src/components/biggive-basic-card/biggive-basic-card.tsx"],"sourcesContent":["@include backgrounds();\n@include fills();\n@include spacers();\n@include text-colours();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n text-align: center;\n background-size: cover;\n background-position: center center;\n padding: $spacer-4;\n height: 100%;\n white-space: pre-wrap;\n a,\n a:hover {\n text-decoration: none;\n }\n .sleeve {\n padding: $spacer-4;\n height: 100%;\n box-sizing: border-box;\n transition: all 1s ease-in-out;\n }\n &.add-animation-true:hover .sleeve {\n margin: -30px;\n padding: 60px;\n height: calc(100% + 60px);\n }\n &.clip-bottom-left-corner-false.clip-top-right-corner-true {\n .sleeve {\n @include corner-clip-medium-top-right();\n }\n }\n &.clip-bottom-left-corner-true.clip-top-right-corner-false {\n .sleeve {\n @include corner-clip-medium-bottom-left();\n }\n }\n &.clip-bottom-left-corner-true.clip-top-right-corner-true {\n .sleeve {\n @include corner-clip-medium-bottom-left-top-right();\n }\n }\n\n .icon {\n svg {\n width: 50px;\n height: auto;\n }\n }\n .title {\n // these have to be the heading level passed in based on order of headings, but in terms of design we want it look like H3.\n @include heading-3();\n margin-bottom: $spacer-3;\n }\n .subtitle {\n margin-bottom: $spacer-3;\n }\n .main-image-container {\n margin-bottom: 15px;\n img {\n width: 100%;\n height: auto;\n }\n }\n .button-wrap {\n text-align: center;\n &.align-left {\n text-align: left;\n }\n &.align-right {\n text-align: right;\n }\n }\n\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { brandColour } from '../../globals/brand-colour';\nimport { spacingOption } from '../../globals/spacing-option';\n\n@Component({\n tag: 'biggive-basic-card',\n styleUrl: 'biggive-basic-card.scss',\n shadow: true,\n})\nexport class BiggiveBasicCard {\n @Prop() spaceBelow: spacingOption = 0;\n\n @Prop() backgroundColour: brandColour = 'primary';\n\n @Prop() backgroundImageUrl: string = '';\n\n @Prop() cardColour: brandColour = 'white';\n\n @Prop() textColour: brandColour = 'black';\n\n @Prop() mainImageUrl: string;\n\n @Prop() mainImageAltText: string;\n\n @Prop() mainTitle: string;\n\n @Prop() subtitle: string;\n\n @Prop() teaser: string;\n\n @Prop() icon: boolean = true;\n\n @Prop() iconColour: brandColour = 'primary';\n\n @Prop() buttonAlign: string = 'center';\n\n @Prop() buttonStyle: string = 'standard';\n\n @Prop() buttonLabel: string;\n\n @Prop() buttonUrl: string;\n\n @Prop() buttonColourScheme: string = 'clear-primary';\n\n @Prop() clipBottomLeftCorner: boolean = true;\n\n @Prop() clipTopRightCorner: boolean = true;\n\n @Prop() headingLevel: 1 \| 2 \| 3 \| 4 \| 5 \| 6 = 3;\n\n @Prop() addAnimation: boolean = false;\n\n render() {\n const HeadingTag = `h${this.headingLevel}`;\n\n return (\n <div\n class={\n 'container space-below-' +\n this.spaceBelow +\n ' background-colour-' +\n this.backgroundColour +\n ' clip-bottom-left-corner-' +\n this.clipBottomLeftCorner +\n ' clip-top-right-corner-' +\n this.clipTopRightCorner +\n ' add-animation-' +\n this.addAnimation\n }\n style={{ 'background-image': \"url('\" + this.backgroundImageUrl + \"')\" }}\n >\n <a href={this.buttonUrl}>\n <div class={'sleeve background-colour-' + this.cardColour + ' text-colour-' + this.textColour}>\n <div class=\"content-wrap\">\n {this.icon == true ? (\n <div class=\"icon\">\n <svg width=\"53\" height=\"39\" viewBox=\"0 0 53 39\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M38.7009 13.6572L52.3535 38.6959H25.0386L38.7009 13.6572Z\" class=\"fill-black\" />\n <path d=\"M20.4789 36.4199L6.36785e-06 5.89713e-05L40.9724 6.61352e-05L20.4789 36.4199Z\" class={'fill-' + this.iconColour} />\n </svg>\n </div>\n ) : null}\n {this.mainImageUrl != '' ? (\n <div class=\"main-image-container\">\n <div class=\"image-wrap\">\n <img src={this.mainImageUrl} alt={this.mainImageAltText} title={this.mainImageAltText} />\n </div>\n </div>\n ) : null}\n <HeadingTag class=\"title\">{this.mainTitle}</HeadingTag>\n <div class=\"subtitle\">{this.subtitle}</div>\n <div class=\"teaser\">{this.teaser}</div>\n {this.buttonLabel != null && this.buttonUrl != null && this.buttonUrl != '' ? (\n <div class={'button-wrap align-' + this.buttonAlign}>\n <biggive-button colour-scheme={this.buttonColourScheme} url={this.buttonUrl} label={this.buttonLabel}></biggive-button>\n </div>\n ) : null}\n </div>\n </div>\n </a>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-beneficiary-icon.js CHANGED Viewed

@@ -19,7 +19,7 @@ const BiggiveBeneficiaryIcon$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveB
         return icon;
     }
     render() {
-        return (h("div", { class: "container" }, h("div", { class: 'beneficiary-icon-item background-colour-' + this.backgroundColour }, h("a", { href: this.url }, h("svg", { width: this.getBeneficiaryIcon().icon[0], height: this.getBeneficiaryIcon().icon[1], xmlns: "http://www.w3.org/2000/svg", class: 'fill-' + this.iconColour, viewBox: '0 0 ' + this.getBeneficiaryIcon().icon[0] + ' ' + this.getBeneficiaryIcon().icon[1] }, h("path", { d: this.getBeneficiaryIcon().icon[4].toString() })))), h("div", { class: "label" }, this.label)));
+        return (h("div", { key: 'b50e06c7174f4aa160b9c2f34b842bb5a630d010', class: "container" }, h("div", { key: '28e605d66f5c46b3252526a0cdb29eeac60f06e9', class: 'beneficiary-icon-item background-colour-' + this.backgroundColour }, h("a", { key: '163ecc6844f7769f2e8696565d3d36ddeaba9cba', href: this.url }, h("svg", { key: 'e03796a2782a4b89d0c6be73ac8c2a546b23388f', width: this.getBeneficiaryIcon().icon[0], height: this.getBeneficiaryIcon().icon[1], xmlns: "http://www.w3.org/2000/svg", class: 'fill-' + this.iconColour, viewBox: '0 0 ' + this.getBeneficiaryIcon().icon[0] + ' ' + this.getBeneficiaryIcon().icon[1] }, h("path", { key: '93b8b98a4c79be0d376cfe8b14e2977c8c792e59', d: this.getBeneficiaryIcon().icon[4].toString() })))), h("div", { key: '364bb552681ed80b68116162dde43633719e1fa5', class: "label" }, this.label)));
     }
     static get style() { return BiggiveBeneficiaryIconStyle0; }
 }, [0, "biggive-beneficiary-icon", {

package/dist/components/biggive-beneficiary-icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-beneficiary-icon.js","mappings":";;;AAAA,MAAM,yBAAyB,GAAG,qgMAAqgM,CAAC;AACxiM,qCAAe,yBAAyB;;MCQ3BA,wBAAsB;;;;gCAIE,SAAS;0BAKf,OAAO;oBAIb,OAAO;;mBAUR,GAAG;;IAEjB,kBAAkB;QACxB,IAAI,IAAI,GAAG,uBAAuB,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACjE,OAAO,IAAI,CAAC;KACb;IAED,MAAM;QACJ,QACE,~~WAAK~~,KAAK,EAAC,WAAW,IACpB,~~WAAK~~,KAAK,EAAE,0CAA0C,GAAG,IAAI,CAAC,gBAAgB,IAC5E,~~SAAG~~,IAAI,EAAE,IAAI,CAAC,GAAG,IACf,~~WACE~~,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EACxC,MAAM,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EACzC,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC,UAAU,EAChC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,IAE7F,~~YAAM~~,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,GAAI,CACrD,CACJ,CACA,EACN,~~WAAK~~,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAO,CACjC,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBeneficiaryIcon"],"sources":["src/components/biggive-beneficiary-icon/biggive-beneficiary-icon.scss?tag=biggive-beneficiary-icon","src/components/biggive-beneficiary-icon/biggive-beneficiary-icon.tsx"],"sourcesContent":["@include backgrounds();\n@include fills();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n display: flex;\n justify-content: flex-start;\n .label {\n padding-left: $spacer-3;\n @include font-size-x-small();\n width: 60px;\n margin-top: auto;\n margin-bottom: auto;\n }\n}\n\n.beneficiary-icon-item {\n @include icon-medium();\n}","import { IconDefinition } from '@fortawesome/fontawesome-svg-core';\nimport { Component, Prop, h } from '@stencil/core';\nimport { FontAwesomeIconsService } from '../../util/fontawesome-icons';\n\n@Component({\n tag: 'biggive-beneficiary-icon',\n styleUrl: 'biggive-beneficiary-icon.scss',\n shadow: false,\n})\nexport class BiggiveBeneficiaryIcon {\n /*\n Background colour\n /\n @Prop() backgroundColour: string = 'primary';\n\n /\n Background colour\n /\n @Prop() iconColour: string = 'white';\n /\n Icon\n /\n @Prop() icon: string = 'Other';\n\n /\n Label\n /\n @Prop() label: string;\n\n /\n Url\n */\n @Prop() url: string = '#';\n\n private getBeneficiaryIcon(): IconDefinition {\n var icon = FontAwesomeIconsService.getBeneficiaryIcon(this.icon);\n return icon;\n }\n\n render() {\n return (\n <div class=\"container\">\n <div class={'beneficiary-icon-item background-colour-' + this.backgroundColour}>\n <a href={this.url}>\n <svg\n width={this.getBeneficiaryIcon().icon[0]}\n height={this.getBeneficiaryIcon().icon[1]}\n xmlns=\"http://www.w3.org/2000/svg\"\n class={'fill-' + this.iconColour}\n viewBox={'0 0 ' + this.getBeneficiaryIcon().icon[0] + ' ' + this.getBeneficiaryIcon().icon[1]}\n >\n <path d={this.getBeneficiaryIcon().icon[4].toString()} />\n </svg>\n </a>\n </div>\n <div class=\"label\">{this.label}</div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-beneficiary-icon.js","mappings":";;;AAAA,MAAM,yBAAyB,GAAG,qgMAAqgM,CAAC;AACxiM,qCAAe,yBAAyB;;MCQ3BA,wBAAsB;;;;gCAIE,SAAS;0BAKf,OAAO;oBAIb,OAAO;;mBAUR,GAAG;;IAEjB,kBAAkB;QACxB,IAAI,IAAI,GAAG,uBAAuB,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACjE,OAAO,IAAI,CAAC;KACb;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,WAAW,IACpB,4DAAK,KAAK,EAAE,0CAA0C,GAAG,IAAI,CAAC,gBAAgB,IAC5E,0DAAG,IAAI,EAAE,IAAI,CAAC,GAAG,IACf,4DACE,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EACxC,MAAM,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EACzC,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC,UAAU,EAChC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,IAE7F,6DAAM,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,GAAI,CACrD,CACJ,CACA,EACN,4DAAK,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAO,CACjC,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBeneficiaryIcon"],"sources":["src/components/biggive-beneficiary-icon/biggive-beneficiary-icon.scss?tag=biggive-beneficiary-icon","src/components/biggive-beneficiary-icon/biggive-beneficiary-icon.tsx"],"sourcesContent":["@include backgrounds();\n@include fills();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n display: flex;\n justify-content: flex-start;\n .label {\n padding-left: $spacer-3;\n @include font-size-x-small();\n width: 60px;\n margin-top: auto;\n margin-bottom: auto;\n }\n}\n\n.beneficiary-icon-item {\n @include icon-medium();\n}","import { IconDefinition } from '@fortawesome/fontawesome-svg-core';\nimport { Component, Prop, h } from '@stencil/core';\nimport { FontAwesomeIconsService } from '../../util/fontawesome-icons';\n\n@Component({\n tag: 'biggive-beneficiary-icon',\n styleUrl: 'biggive-beneficiary-icon.scss',\n shadow: false,\n})\nexport class BiggiveBeneficiaryIcon {\n /*\n Background colour\n /\n @Prop() backgroundColour: string = 'primary';\n\n /\n Background colour\n /\n @Prop() iconColour: string = 'white';\n /\n Icon\n /\n @Prop() icon: string = 'Other';\n\n /\n Label\n /\n @Prop() label: string;\n\n /\n Url\n */\n @Prop() url: string = '#';\n\n private getBeneficiaryIcon(): IconDefinition {\n var icon = FontAwesomeIconsService.getBeneficiaryIcon(this.icon);\n return icon;\n }\n\n render() {\n return (\n <div class=\"container\">\n <div class={'beneficiary-icon-item background-colour-' + this.backgroundColour}>\n <a href={this.url}>\n <svg\n width={this.getBeneficiaryIcon().icon[0]}\n height={this.getBeneficiaryIcon().icon[1]}\n xmlns=\"http://www.w3.org/2000/svg\"\n class={'fill-' + this.iconColour}\n viewBox={'0 0 ' + this.getBeneficiaryIcon().icon[0] + ' ' + this.getBeneficiaryIcon().icon[1]}\n >\n <path d={this.getBeneficiaryIcon().icon[4].toString()} />\n </svg>\n </a>\n </div>\n <div class=\"label\">{this.label}</div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-boxed-content.js CHANGED Viewed

@@ -15,7 +15,7 @@ const BiggiveBoxedContent$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBoxe
         this.shadow = true;
     }
     render() {
-        return (h("div", { class: 'container background-colour-' +
+        return (h("div", { key: '514a5edbfeee33509e63941484400b8fb99d57f9', class: 'container background-colour-' +
                 this.backgroundColour +
                 ' space-below-' +
                 this.spaceBelow +
@@ -24,7 +24,7 @@ const BiggiveBoxedContent$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBoxe
                 ' vertical-padding-' +
                 this.verticalPadding +
                 ' shadow-' +
-                this.shadow }, h("slot", null)));
+                this.shadow }, h("slot", { key: 'b2f653b6f1e3aed050264a3dc4fae71a31a80a43' })));
     }
     static get style() { return BiggiveBoxedContentStyle0; }
 }, [1, "biggive-boxed-content", {

package/dist/components/biggive-boxed-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-boxed-content.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,ujGAAujG,CAAC;AACvlG,kCAAe,sBAAsB;;MCMxBA,qBAAmB;;;;;0BAID,CAAC;+BAII,CAAC;iCAIC,CAAC;gCAIF,OAAO;sBAIhB,IAAI;;IAE9B,MAAM;QACJ,QACE,~~WACE~~,KAAK,EACH,8BAA8B;gBAC9B,IAAI,CAAC,gBAAgB;gBACrB,eAAe;gBACf,IAAI,CAAC,UAAU;gBACf,sBAAsB;gBACtB,IAAI,CAAC,iBAAiB;gBACtB,oBAAoB;gBACpB,IAAI,CAAC,eAAe;gBACpB,UAAU;gBACV,IAAI,CAAC,MAAM,IAGb,~~eAAa~~,CACT,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBoxedContent"],"sources":["src/components/biggive-boxed-content/biggive-boxed-content.scss?tag=biggive-boxed-content&encapsulation=shadow","src/components/biggive-boxed-content/biggive-boxed-content.tsx"],"sourcesContent":["@include backgrounds();\n\n:host {\n display: content;\n}\n\n.container {\n @include standard-font();\n &.shadow-true {\n @include lower-shadow();\n } \n}\n\n.horizontal-padding-1 { padding-left: $spacer-1; padding-right: $spacer-1; }\n.horizontal-padding-2 { padding-left: $spacer-2; padding-right: $spacer-2; }\n.horizontal-padding-3 { padding-left: $spacer-3; padding-right: $spacer-3; }\n.horizontal-padding-4 { padding-left: $spacer-4; padding-right: $spacer-4; }\n.horizontal-padding-5 { padding-left: $spacer-5; padding-right: $spacer-5; }\n.horizontal-padding-6 { padding-left: $spacer-6; padding-right: $spacer-6; }\n\n.vertical-padding-1 { padding-top: $spacer-1; padding-bottom: $spacer-1; }\n.vertical-padding-2 { padding-top: $spacer-2; padding-bottom: $spacer-2; }\n.vertical-padding-3 { padding-top: $spacer-3; padding-bottom: $spacer-3; }\n.vertical-padding-4 { padding-top: $spacer-4; padding-bottom: $spacer-4; }\n.vertical-padding-5 { padding-top: $spacer-5; padding-bottom: $spacer-5; }\n.vertical-padding-6 { padding-top: $spacer-6; padding-bottom: $spacer-6; }","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-boxed-content',\n styleUrl: 'biggive-boxed-content.scss',\n shadow: true,\n})\nexport class BiggiveBoxedContent {\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Vertical padding\n /\n @Prop() verticalPadding: number = 3;\n /\n Horizontal padding\n /\n @Prop() horizontalPadding: number = 3;\n /\n Background colour\n /\n @Prop() backgroundColour: string = 'white';\n /\n Shadow\n */\n @Prop() shadow: boolean = true;\n\n render() {\n return (\n <div\n class={\n 'container background-colour-' +\n this.backgroundColour +\n ' space-below-' +\n this.spaceBelow +\n ' horizontal-padding-' +\n this.horizontalPadding +\n ' vertical-padding-' +\n this.verticalPadding +\n ' shadow-' +\n this.shadow\n }\n >\n <slot></slot>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-boxed-content.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,ujGAAujG,CAAC;AACvlG,kCAAe,sBAAsB;;MCMxBA,qBAAmB;;;;;0BAID,CAAC;+BAII,CAAC;iCAIC,CAAC;gCAIF,OAAO;sBAIhB,IAAI;;IAE9B,MAAM;QACJ,QACE,4DACE,KAAK,EACH,8BAA8B;gBAC9B,IAAI,CAAC,gBAAgB;gBACrB,eAAe;gBACf,IAAI,CAAC,UAAU;gBACf,sBAAsB;gBACtB,IAAI,CAAC,iBAAiB;gBACtB,oBAAoB;gBACpB,IAAI,CAAC,eAAe;gBACpB,UAAU;gBACV,IAAI,CAAC,MAAM,IAGb,8DAAa,CACT,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBoxedContent"],"sources":["src/components/biggive-boxed-content/biggive-boxed-content.scss?tag=biggive-boxed-content&encapsulation=shadow","src/components/biggive-boxed-content/biggive-boxed-content.tsx"],"sourcesContent":["@include backgrounds();\n\n:host {\n display: content;\n}\n\n.container {\n @include standard-font();\n &.shadow-true {\n @include lower-shadow();\n } \n}\n\n.horizontal-padding-1 { padding-left: $spacer-1; padding-right: $spacer-1; }\n.horizontal-padding-2 { padding-left: $spacer-2; padding-right: $spacer-2; }\n.horizontal-padding-3 { padding-left: $spacer-3; padding-right: $spacer-3; }\n.horizontal-padding-4 { padding-left: $spacer-4; padding-right: $spacer-4; }\n.horizontal-padding-5 { padding-left: $spacer-5; padding-right: $spacer-5; }\n.horizontal-padding-6 { padding-left: $spacer-6; padding-right: $spacer-6; }\n\n.vertical-padding-1 { padding-top: $spacer-1; padding-bottom: $spacer-1; }\n.vertical-padding-2 { padding-top: $spacer-2; padding-bottom: $spacer-2; }\n.vertical-padding-3 { padding-top: $spacer-3; padding-bottom: $spacer-3; }\n.vertical-padding-4 { padding-top: $spacer-4; padding-bottom: $spacer-4; }\n.vertical-padding-5 { padding-top: $spacer-5; padding-bottom: $spacer-5; }\n.vertical-padding-6 { padding-top: $spacer-6; padding-bottom: $spacer-6; }","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-boxed-content',\n styleUrl: 'biggive-boxed-content.scss',\n shadow: true,\n})\nexport class BiggiveBoxedContent {\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Vertical padding\n /\n @Prop() verticalPadding: number = 3;\n /\n Horizontal padding\n /\n @Prop() horizontalPadding: number = 3;\n /\n Background colour\n /\n @Prop() backgroundColour: string = 'white';\n /\n Shadow\n */\n @Prop() shadow: boolean = true;\n\n render() {\n return (\n <div\n class={\n 'container background-colour-' +\n this.backgroundColour +\n ' space-below-' +\n this.spaceBelow +\n ' horizontal-padding-' +\n this.horizontalPadding +\n ' vertical-padding-' +\n this.verticalPadding +\n ' shadow-' +\n this.shadow\n }\n >\n <slot></slot>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-branded-image.js CHANGED Viewed

@@ -17,7 +17,7 @@ const BiggiveBrandedImage$1 = /*@__PURE__*/ proxyCustomElement(class BiggiveBran
         this.charityUrl = undefined;
     }
     render() {
-        return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "slug" }, this.slug), this.imageUrl !== undefined && this.imageUrl !== null ? (h("div", { class: "image-wrap" }, h("img", { src: this.imageUrl }))) : null, this.logoUrl !== undefined && this.logoUrl !== null ? h("div", { class: "logo-wrap", style: { 'background-image': "url('" + this.logoUrl + "')" } }) : null, this.charityName !== undefined && this.charityName !== null ? h("h3", { class: "title" }, this.charityName) : null, this.charityLocation !== undefined && this.charityLocation !== null ? h("div", { class: "charity-info" }, this.charityLocation) : null));
+        return (h("div", { key: '45bb58ecd06507d67e0e3607f60dbbb1d2a76fd6', class: 'container space-below-' + this.spaceBelow }, h("div", { class: "slug" }, this.slug), this.imageUrl !== undefined && this.imageUrl !== null ? (h("div", { class: "image-wrap" }, h("img", { src: this.imageUrl }))) : null, this.logoUrl !== undefined && this.logoUrl !== null ? h("div", { class: "logo-wrap", style: { 'background-image': "url('" + this.logoUrl + "')" } }) : null, this.charityName !== undefined && this.charityName !== null ? h("h3", { class: "title" }, this.charityName) : null, this.charityLocation !== undefined && this.charityLocation !== null ? h("div", { class: "charity-info" }, this.charityLocation) : null));
     }
     static get style() { return BiggiveBrandedImageStyle0; }
 }, [1, "biggive-branded-image", {

package/dist/components/biggive-branded-image.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-branded-image.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,6vDAA6vD,CAAC;AAC7xD,kCAAe,sBAAsB;;MCMxBA,qBAAmB;;;;;0BAID,CAAC;wBAIH,EAAE;uBAKH,EAAE;;;;;;IAuB5B,MAAM;QACJ,QACE,~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,IACnD,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAO,EACnC,IAAI,CAAC,QAAQ,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,IACpD,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,GAAI,CACvB,IACJ,IAAI,EACP,IAAI,CAAC,OAAO,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,GAAG,WAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,GAAQ,GAAG,IAAI,EAExJ,IAAI,CAAC,WAAW,KAAK,SAAS,IAAI,IAAI,CAAC,WAAW,KAAK,IAAI,GAAG,UAAI,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,WAAW,CAAM,GAAG,IAAI,EAC9G,IAAI,CAAC,eAAe,KAAK,SAAS,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,GAAG,WAAK,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,eAAe,CAAO,GAAG,IAAI,CAChI,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBrandedImage"],"sources":["src/components/biggive-branded-image/biggive-branded-image.scss?tag=biggive-branded-image&encapsulation=shadow","src/components/biggive-branded-image/biggive-branded-image.tsx"],"sourcesContent":["@include image-alignment();\n@include spacers();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n .slug {\n text-align: center;\n font-weight: bold;\n background-color: $colour-secondary-green;\n color: $colour-black;\n padding: $spacer-1 $spacer-3;\n width: 100%;\n margin: -17px auto 17px auto;\n transform: translateY(50%);\n box-sizing: border-box;\n }\n\n img {\n width: 100%;\n }\n\n .logo-wrap {\n border-radius: 50%;\n width: 120px;\n height: 120px;\n transform: translateY(-50%);\n margin-top: 30px;\n margin-bottom: -30px; // Breathing space before charity name etc.\n background-size: contain;\n background-position: center center;\n background-repeat: no-repeat;\n background-color: #FFFFFF;\n\n @media screen and (max-width: $screen-tablet-max) {\n width: 100px;\n height: 100px;\n }\n\n @media screen and (max-width: $screen-mobile-max) {\n width: 70px;\n height: 70px;\n margin-top: 20px;\n }\n }\n\n #charityName {\n color: $colour-primary-blue;\n display: block;\n margin-bottom: 5px;\n width: fit-content; // so link doesn't go full width\n }\n\n #charityName, .charity-info {\n font-size: 17px;\n\n @media screen and (max-width: $screen-tablet-max) {\n font-size: 16px;\n }\n\n @media screen and (max-width: $screen-mobile-max) {\n font-size: 15px;\n }\n\n @media screen and (max-width: $screen-mobile-small) {\n font-size: 14px;\n }\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-branded-image',\n styleUrl: 'biggive-branded-image.scss',\n shadow: true,\n})\nexport class BiggiveBrandedImage {\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Full URL of a image.\n /\n @Prop() imageUrl: string = '';\n\n /\n Full URL of the logo.\n /\n @Prop() logoUrl: string = '';\n\n /\n Slug\n /\n @Prop() slug: string;\n\n /\n Charity name\n /\n @Prop() charityName: string;\n\n /\n Charity location\n /\n @Prop() charityLocation: string;\n\n /\n Link to the charity's website\n * @deprecated We should stop passing this soon, and will link to charity URLs alongside socials.\n */\n @Prop() charityUrl: string;\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n {<div class=\"slug\">{this.slug}</div>}\n {this.imageUrl !== undefined && this.imageUrl !== null ? (\n <div class=\"image-wrap\">\n <img src={this.imageUrl} />\n </div>\n ) : null}\n {this.logoUrl !== undefined && this.logoUrl !== null ? <div class=\"logo-wrap\" style={{ 'background-image': \"url('\" + this.logoUrl + \"')\" }}></div> : null}\n\n {this.charityName !== undefined && this.charityName !== null ? <h3 class=\"title\">{this.charityName}</h3> : null}\n {this.charityLocation !== undefined && this.charityLocation !== null ? <div class=\"charity-info\">{this.charityLocation}</div> : null}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-branded-image.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,6vDAA6vD,CAAC;AAC7xD,kCAAe,sBAAsB;;MCMxBA,qBAAmB;;;;;0BAID,CAAC;wBAIH,EAAE;uBAKH,EAAE;;;;;;IAuB5B,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,IACnD,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAO,EACnC,IAAI,CAAC,QAAQ,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,IACpD,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,GAAI,CACvB,IACJ,IAAI,EACP,IAAI,CAAC,OAAO,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,GAAG,WAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,EAAE,kBAAkB,EAAE,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,GAAQ,GAAG,IAAI,EAExJ,IAAI,CAAC,WAAW,KAAK,SAAS,IAAI,IAAI,CAAC,WAAW,KAAK,IAAI,GAAG,UAAI,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,WAAW,CAAM,GAAG,IAAI,EAC9G,IAAI,CAAC,eAAe,KAAK,SAAS,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,GAAG,WAAK,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,eAAe,CAAO,GAAG,IAAI,CAChI,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BiggiveBrandedImage"],"sources":["src/components/biggive-branded-image/biggive-branded-image.scss?tag=biggive-branded-image&encapsulation=shadow","src/components/biggive-branded-image/biggive-branded-image.tsx"],"sourcesContent":["@include image-alignment();\n@include spacers();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n position: relative;\n .slug {\n text-align: center;\n font-weight: bold;\n background-color: $colour-secondary-green;\n color: $colour-black;\n padding: $spacer-1 $spacer-3;\n width: 100%;\n margin: -17px auto 17px auto;\n transform: translateY(50%);\n box-sizing: border-box;\n }\n\n img {\n width: 100%;\n }\n\n .logo-wrap {\n border-radius: 50%;\n width: 120px;\n height: 120px;\n transform: translateY(-50%);\n margin-top: 30px;\n margin-bottom: -30px; // Breathing space before charity name etc.\n background-size: contain;\n background-position: center center;\n background-repeat: no-repeat;\n background-color: #FFFFFF;\n\n @media screen and (max-width: $screen-tablet-max) {\n width: 100px;\n height: 100px;\n }\n\n @media screen and (max-width: $screen-mobile-max) {\n width: 70px;\n height: 70px;\n margin-top: 20px;\n }\n }\n\n #charityName {\n color: $colour-primary-blue;\n display: block;\n margin-bottom: 5px;\n width: fit-content; // so link doesn't go full width\n }\n\n #charityName, .charity-info {\n font-size: 17px;\n\n @media screen and (max-width: $screen-tablet-max) {\n font-size: 16px;\n }\n\n @media screen and (max-width: $screen-mobile-max) {\n font-size: 15px;\n }\n\n @media screen and (max-width: $screen-mobile-small) {\n font-size: 14px;\n }\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-branded-image',\n styleUrl: 'biggive-branded-image.scss',\n shadow: true,\n})\nexport class BiggiveBrandedImage {\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 0;\n /\n Full URL of a image.\n /\n @Prop() imageUrl: string = '';\n\n /\n Full URL of the logo.\n /\n @Prop() logoUrl: string = '';\n\n /\n Slug\n /\n @Prop() slug: string;\n\n /\n Charity name\n /\n @Prop() charityName: string;\n\n /\n Charity location\n /\n @Prop() charityLocation: string;\n\n /\n Link to the charity's website\n * @deprecated We should stop passing this soon, and will link to charity URLs alongside socials.\n */\n @Prop() charityUrl: string;\n\n render() {\n return (\n <div class={'container space-below-' + this.spaceBelow}>\n {<div class=\"slug\">{this.slug}</div>}\n {this.imageUrl !== undefined && this.imageUrl !== null ? (\n <div class=\"image-wrap\">\n <img src={this.imageUrl} />\n </div>\n ) : null}\n {this.logoUrl !== undefined && this.logoUrl !== null ? <div class=\"logo-wrap\" style={{ 'background-image': \"url('\" + this.logoUrl + \"')\" }}></div> : null}\n\n {this.charityName !== undefined && this.charityName !== null ? <h3 class=\"title\">{this.charityName}</h3> : null}\n {this.charityLocation !== undefined && this.charityLocation !== null ? <div class=\"charity-info\">{this.charityLocation}</div> : null}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/biggive-button2.js CHANGED Viewed

@@ -28,7 +28,7 @@ const BiggiveButton = /*@__PURE__*/ proxyCustomElement(class BiggiveButton exten
         // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
         // interaction separately.
         const href = this.url || 'javascript:void(0);';
-        return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
+        return (h("div", { key: 'd55858059bea2eb86fd5d80e92af9fcc9fbc25ea', class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { key: '73db1a2a239985f3480a695e0c9529fa5896dec1', role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { key: '043bd6a0bb4a930cc5ef87fab0544b97dc0c1ddd', onClick: this.handleButtonClick }, this.label))));
     }
     static get style() { return BiggiveButtonStyle0; }
 }, [1, "biggive-button", {

package/dist/components/biggive-button2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"biggive-button2.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,u/UAAu/U,CAAC;AACjhV,4BAAe,gBAAgB;;MCMlB,aAAa;;;;;;QAwDhB,sBAAiB,GAAG,CAAC,KAAU;YACrC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC;SACjF,CAAC;0BA9C2B,CAAC;4BAKC,SAAS;qBAKhB,UAAU;;4BAUF,KAAK;yBAKR,KAAK;oBAKX,QAAQ;uBAKJ,KAAK;wBAKJ,KAAK;wBAEM,SAAS;;IAMhD,MAAM;;;;QAIJ,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,IAAI,qBAAqB,CAAC;QAE/C,QACE,~~WAAK~~,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,IAAI,CAAC,QAAQ,IACnF,~~SACE~~,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,IAAI,CAAC,YAAY,GAAG,QAAQ,GAAG,OAAO,EAC9C,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,KAAK,EAAE,gBAAgB,GAAG,IAAI,CAAC,YAAY,GAAG,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,GAAG,QAAQ,GAAG,IAAI,CAAC,IAAI,GAAG,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,IAEvJ,~~YAAM~~,OAAO,EAAE,IAAI,CAAC,iBAAiB,IAAG,IAAI,CAAC,KAAK,CAAQ,CACxD,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/biggive-button/biggive-button.scss?tag=biggive-button&encapsulation=shadow","src/components/biggive-button/biggive-button.tsx"],"sourcesContent":["@include spacers();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n a {\n display: inline-block;\n &.full-width-true {\n display: block;\n }\n }\n &.centered-true {\n text-align: center;\n }\n}\n\n.button {\n @include button();\n &.size-small {\n @include button-small();\n }\n\n &.button.rounded-true {\n @include button-rounded();\n }\n}\n// brand-6 color ambiguity (for now keeping its definition outside of the brand colors loop)\n.button-clear-brand-6 {\n color: $colour-brand-grey;\n background-color: transparent;\n text-decoration: underline;\n border: 0;\n padding-left: 0;\n padding-right: 0;\n &:hover {\n text-decoration: none;\n background-color: transparent;\n }\n}\n\n@each $brand, $colour in $colours {\n .button-#{$brand} {\n color: $colour-white; // may be overridden by following rules. Later CSS rules have priority.\n background-color: $colour;\n border-color: $colour;\n &:hover {\n color: $colour;\n background-color: $colour-white; // may be overriden by following rules\n }\n }\n}\n\n// not part of loop, 6 is deprecated\n.button-brand-6 {\n color: $colour-white;\n background-color: $colour-brand-grey;\n border-color: $colour-brand-grey;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-secondary {\n color: $colour-black;\n &:hover {\n color: $colour-black;\n background-color: $colour-white;\n border-color: $colour-black;\n }\n}\n\n.button-brand-4 {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-grey {\n color: $colour-white;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-mhf-turquoise {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-afa-pink {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-white {\n color: $colour-primary-blue;\n &:hover {\n color: $colour-black;\n background-color: $colour-secondary-green;\n }\n}\n\n.button-black {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-grey-extra-light {\n color: $colour-black;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-grey-light {\n color: $colour-black;\n &:hover {\n background-color: $colour-black;\n }}\n\n.button-grey-medium {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-grey-dark {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-rounded {\n @include button-rounded();\n }\n\n @each $brand, $colour in $colours {\n .button-clear-#{$brand} {\n color: $colour;\n background-color: transparent;\n text-decoration: underline;\n border: 0;\n padding-left: 0;\n padding-right: 0;\n &:hover {\n color: $colour;\n text-decoration: none;\n background-color: transparent;\n }\n }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-button',\n styleUrl: 'biggive-button.scss',\n shadow: true,\n})\nexport class BiggiveButton {\n @Event({\n eventName: 'doButtonClick',\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n doButtonClick: EventEmitter<{ event: object; url: string }>;\n\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 1;\n\n /\n Colour Scheme\n /\n @Prop() colourScheme: string = 'primary';\n\n /\n Text\n /\n @Prop() label: string = 'Click me';\n\n /\n URL\n /\n @Prop() url: string \| undefined;\n\n /\n New Tab\n /\n @Prop() openInNewTab: boolean = false;\n\n /\n Display full width\n /\n @Prop() fullWidth: boolean = false;\n\n /\n Size\n /\n @Prop() size: string = 'medium';\n\n /\n Rounded corners\n /\n @Prop() rounded: boolean = false;\n\n /\n Centered\n */\n @Prop() centered: boolean = false;\n\n @Prop() buttonId: undefined \| string = undefined;\n\n private handleButtonClick = (event: any) => {\n this.doButtonClick.emit({ event: event, url: event.target.parentElement.href });\n };\n\n render() {\n // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.\n // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard\n // interaction separately.\n const href = this.url \|\| 'javascript:void(0);';\n\n return (\n <div class={'container space-below-' + this.spaceBelow + ' centered-' + this.centered}>\n <a\n role=\"button\"\n href={href}\n target={this.openInNewTab ? '_blank' : '_self'}\n id={this.buttonId}\n class={'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString()}\n >\n <span onClick={this.handleButtonClick}>{this.label}</span>\n </a>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"biggive-button2.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,u/UAAu/U,CAAC;AACjhV,4BAAe,gBAAgB;;MCMlB,aAAa;;;;;;QAwDhB,sBAAiB,GAAG,CAAC,KAAU;YACrC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC;SACjF,CAAC;0BA9C2B,CAAC;4BAKC,SAAS;qBAKhB,UAAU;;4BAUF,KAAK;yBAKR,KAAK;oBAKX,QAAQ;uBAKJ,KAAK;wBAKJ,KAAK;wBAEM,SAAS;;IAMhD,MAAM;;;;QAIJ,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,IAAI,qBAAqB,CAAC;QAE/C,QACE,4DAAK,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,IAAI,CAAC,QAAQ,IACnF,0DACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,IAAI,CAAC,YAAY,GAAG,QAAQ,GAAG,OAAO,EAC9C,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,KAAK,EAAE,gBAAgB,GAAG,IAAI,CAAC,YAAY,GAAG,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,GAAG,QAAQ,GAAG,IAAI,CAAC,IAAI,GAAG,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,IAEvJ,6DAAM,OAAO,EAAE,IAAI,CAAC,iBAAiB,IAAG,IAAI,CAAC,KAAK,CAAQ,CACxD,CACA,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/biggive-button/biggive-button.scss?tag=biggive-button&encapsulation=shadow","src/components/biggive-button/biggive-button.tsx"],"sourcesContent":["@include spacers();\n\n:host {\n display: contents;\n}\n\n.container {\n @include standard-font();\n a {\n display: inline-block;\n &.full-width-true {\n display: block;\n }\n }\n &.centered-true {\n text-align: center;\n }\n}\n\n.button {\n @include button();\n &.size-small {\n @include button-small();\n }\n\n &.button.rounded-true {\n @include button-rounded();\n }\n}\n// brand-6 color ambiguity (for now keeping its definition outside of the brand colors loop)\n.button-clear-brand-6 {\n color: $colour-brand-grey;\n background-color: transparent;\n text-decoration: underline;\n border: 0;\n padding-left: 0;\n padding-right: 0;\n &:hover {\n text-decoration: none;\n background-color: transparent;\n }\n}\n\n@each $brand, $colour in $colours {\n .button-#{$brand} {\n color: $colour-white; // may be overridden by following rules. Later CSS rules have priority.\n background-color: $colour;\n border-color: $colour;\n &:hover {\n color: $colour;\n background-color: $colour-white; // may be overriden by following rules\n }\n }\n}\n\n// not part of loop, 6 is deprecated\n.button-brand-6 {\n color: $colour-white;\n background-color: $colour-brand-grey;\n border-color: $colour-brand-grey;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-secondary {\n color: $colour-black;\n &:hover {\n color: $colour-black;\n background-color: $colour-white;\n border-color: $colour-black;\n }\n}\n\n.button-brand-4 {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-grey {\n color: $colour-white;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-mhf-turquoise {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-brand-afa-pink {\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-white {\n color: $colour-primary-blue;\n &:hover {\n color: $colour-black;\n background-color: $colour-secondary-green;\n }\n}\n\n.button-black {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-grey-extra-light {\n color: $colour-black;\n &:hover {\n background-color: $colour-black;\n }\n}\n\n.button-grey-light {\n color: $colour-black;\n &:hover {\n background-color: $colour-black;\n }}\n\n.button-grey-medium {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-grey-dark {\n color: $colour-white;\n &:hover {\n background-color: $colour-white;\n }\n}\n\n.button-rounded {\n @include button-rounded();\n }\n\n @each $brand, $colour in $colours {\n .button-clear-#{$brand} {\n color: $colour;\n background-color: transparent;\n text-decoration: underline;\n border: 0;\n padding-left: 0;\n padding-right: 0;\n &:hover {\n color: $colour;\n text-decoration: none;\n background-color: transparent;\n }\n }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'biggive-button',\n styleUrl: 'biggive-button.scss',\n shadow: true,\n})\nexport class BiggiveButton {\n @Event({\n eventName: 'doButtonClick',\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n doButtonClick: EventEmitter<{ event: object; url: string }>;\n\n /*\n Space below component\n /\n @Prop() spaceBelow: number = 1;\n\n /\n Colour Scheme\n /\n @Prop() colourScheme: string = 'primary';\n\n /\n Text\n /\n @Prop() label: string = 'Click me';\n\n /\n URL\n /\n @Prop() url: string \| undefined;\n\n /\n New Tab\n /\n @Prop() openInNewTab: boolean = false;\n\n /\n Display full width\n /\n @Prop() fullWidth: boolean = false;\n\n /\n Size\n /\n @Prop() size: string = 'medium';\n\n /\n Rounded corners\n /\n @Prop() rounded: boolean = false;\n\n /\n Centered\n */\n @Prop() centered: boolean = false;\n\n @Prop() buttonId: undefined \| string = undefined;\n\n private handleButtonClick = (event: any) => {\n this.doButtonClick.emit({ event: event, url: event.target.parentElement.href });\n };\n\n render() {\n // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.\n // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard\n // interaction separately.\n const href = this.url \|\| 'javascript:void(0);';\n\n return (\n <div class={'container space-below-' + this.spaceBelow + ' centered-' + this.centered}>\n <a\n role=\"button\"\n href={href}\n target={this.openInNewTab ? '_blank' : '_self'}\n id={this.buttonId}\n class={'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString()}\n >\n <span onClick={this.handleButtonClick}>{this.label}</span>\n </a>\n </div>\n );\n }\n}\n"],"version":3}