@biggive/components 1.0.192 → 1.0.193

package/dist/esm/biggive-category-icon.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h } from './index-072f98c6.js';
-import { F as FontAwesomeIconsService } from './fontawesome-icons-0af46a96.js';
+import { F as FontAwesomeIconsService } from './fontawesome-icons-ec5d0760.js';
 import './index-93ca83cc.js';
 
 const biggiveCategoryIconCss = "body{background-color:#FFFFFF}body.background-primary{background-color:#2C089B}body.background-secondary{background-color:#2C089B}body.background-tertiary{background-color:#2C089B}body.background-brand-1{background-color:#B30510}body.background-brand-2{background-color:#B30510}body.background-brand-3{background-color:#B30510}body.background-brand-4{background-color:#B30510}body.background-brand-5{background-color:#B30510}body.background-brand-6{background-color:#B30510}h1,h3,h4,h5,h6{margin-bottom:0}h1,.heading-1{font-size:47px;line-height:60px;font-weight:bold}h2,.heading-2{font-size:38px;line-height:45px;font-weight:bold}h3,.heading-3{font-size:25px;line-height:32px;font-weight:bold}h4,.heading-4{font-size:20px;line-height:24px;font-weight:bold}h5,.heading-5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-brand-1{color:#B30510}.colour-brand-2{color:#6E0887}.colour-brand-3{color:#50B400}.colour-brand-4{color:#FFE500}.colour-brand-5{color:#F07D00}.colour-brand-6{color:#CBC8C8}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-brand-1{fill:#B30510}.fill-brand-2{fill:#6E0887}.fill-brand-3{fill:#50B400}.fill-brand-4{fill:#FFE500}.fill-brand-5{fill:#F07D00}.fill-brand-6{fill:#CBC8C8}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.fill-red{fill:red}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#CBC8C8}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-transparent{background-color:transparent}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:17px;line-height:24px;padding:10px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#000000;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF;border-color:#000000}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-brand-1{color:#FFFFFF;background-color:#B30510;border-color:#B30510}.button-brand-1:hover{background-color:#FFFFFF}.button-brand-2{color:#FFFFFF;background-color:#6E0887;border-color:#6E0887}.button-brand-2:hover{background-color:#FFFFFF}.button-brand-3{color:#FFFFFF;background-color:#50B400;border-color:#50B400}.button-brand-3:hover{background-color:#FFFFFF}.button-brand-4{color:#FFFFFF;background-color:#FFE500;border-color:#FFE500}.button-brand-4:hover{background-color:#000000}.button-brand-5{color:#FFFFFF;background-color:#F07D00;border-color:#F07D00}.button-brand-5:hover{background-color:#FFFFFF}.button-brand-6{color:#FFFFFF;background-color:#CBC8C8;border-color:#CBC8C8}.button-brand-6:hover{background-color:#000000}.button-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#FFFFFF;background-color:#2C089B}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-brand-1{color:#B30510;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-1:hover{text-decoration:none;background-color:transparent}.button-clear-brand-2{color:#6E0887;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-2:hover{text-decoration:none;background-color:transparent}.button-clear-brand-3{color:#50B400;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-3:hover{text-decoration:none;background-color:transparent}.button-clear-brand-4{color:#FFE500;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-4:hover{text-decoration:none;background-color:transparent}.button-clear-brand-5{color:#F07D00;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-5:hover{text-decoration:none;background-color:transparent}.button-clear-brand-6{color:#CBC8C8;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-6:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:27.5px}.button-rounded.size-small{border-radius:20px}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap{position:relative;padding-bottom:56.25%}.video-wrap iframe,.video-wrap video{position:absolute;border:0;display:block;left:0;right:0;top:0;bottom:0;width:100%;height:100%}.image-wrap img{width:100%;height:auto}.align-left{text-align:left}.align-right{text-align:right}.align-center{text-align:center}.align-justify{text-align:justify}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;display:flex;justify-content:flex-start}.container .label{padding-left:15px;font-size:11px;line-height:14px;width:60px;margin-top:auto;margin-bottom:auto}.category-icon-item{width:40px;height:40px;border-radius:50%;text-align:center;transition:all ease-in-out 0.5s;display:inline-block;margin-right:10px;width:30px;height:30px}.category-icon-item.colour-scheme-primary{background-color:#2C089B}.category-icon-item.colour-scheme-primary svg{fill:#FFFFFF}.category-icon-item.colour-scheme-secondary{background-color:#2AF135}.category-icon-item.colour-scheme-secondary svg{fill:#000000}.category-icon-item.colour-scheme-tertiary{background-color:#FF7272}.category-icon-item.colour-scheme-tertiary svg{fill:#000000}.category-icon-item.colour-scheme-brand-1{background-color:#B30510}.category-icon-item.colour-scheme-brand-1 svg{fill:#000000}.category-icon-item.colour-scheme-brand-2{background-color:#6E0887}.category-icon-item.colour-scheme-brand-2 svg{fill:#000000}.category-icon-item.colour-scheme-brand-3{background-color:#50B400}.category-icon-item.colour-scheme-brand-3 svg{fill:#000000}.category-icon-item.colour-scheme-brand-4{background-color:#FFE500}.category-icon-item.colour-scheme-brand-4 svg{fill:#000000}.category-icon-item.colour-scheme-brand-5{background-color:#F07D00}.category-icon-item.colour-scheme-brand-5 svg{fill:#000000}.category-icon-item.colour-scheme-brand-6{background-color:#CBC8C8}.category-icon-item.colour-scheme-brand-6 svg{fill:#000000}.category-icon-item.colour-scheme-white{background-color:#FFFFFF}.category-icon-item.colour-scheme-white svg{fill:#000000}.category-icon-item.colour-scheme-black{background-color:#000000}.category-icon-item.colour-scheme-black svg{fill:#FFFFFF}.category-icon-item:hover{background-color:#FFFFFF}.category-icon-item:hover svg{fill:#000000}.category-icon-item a{display:grid;position:relative;padding:10px;box-sizing:border-box;height:100%}.category-icon-item a svg{width:100%;height:100%}.category-icon-item a{padding:6px}";
@@ -9,8 +9,8 @@ const BiggiveCategoryIcon = class {
     registerInstance(this, hostRef);
     this.backgroundColour = 'primary';
     this.iconColour = 'white';
-    this.icon = null;
-    this.label = null;
+    this.icon = undefined;
+    this.label = undefined;
     this.url = '#';
   }
   getCategoryIcon() {

package/dist/esm/biggive-icon-group.entry.js

@@ -6,7 +6,7 @@ const BiggiveIconGroup = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.spaceBelow = 0;
-    this.label = null;
+    this.label = undefined;
   }
   render() {
     return (h("div", { class: 'container space-below-' + this.spaceBelow }, this.label != null ? h("div", { class: "label" }, this.label) : null, h("div", { class: "sleeve" }, h("slot", null))));

package/dist/esm/biggive-nav-item.entry.js

@@ -5,9 +5,9 @@ const biggiveNavItemCss = "body{background-color:#FFFFFF}body.background-primary
 const BiggiveNavItem = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.url = null;
-    this.label = null;
-    this.iconColour = null;
+    this.url = undefined;
+    this.label = undefined;
+    this.iconColour = undefined;
   }
   render() {
     return (h("li", { class: 'icon-' + this.iconColour }, h("a", { href: this.url }, this.label), h("slot", null)));

package/dist/esm/biggive-search.entry.js

@@ -21,7 +21,7 @@ const BigGiveSearch = class {
     this.clearSearchText = () => {
       this.searchText = '';
     };
-    this.searchText = null;
+    this.searchText = undefined;
     this.placeholderText = undefined;
     this.buttonText = undefined;
   }

package/dist/esm/{fontawesome-icons-0af46a96.js → fontawesome-icons-ec5d0760.js}

@@ -232,22 +232,22 @@ class FontAwesomeIconsService {
   static getBeneficiaryIcon(beneficiary) {
     const matchingItems = FontAwesomeIconsService.getBeneficiaries().filter(ii => ii.name === beneficiary);
     // For an unknown/invalid beneficiary, show 'other' symbol.
-    return matchingItems.length > 0 ? matchingItems[0].icon : faPlus;
+    return matchingItems[0] ? matchingItems[0].icon : faPlus;
   }
   static getMiscIcon(misc) {
     const matchingItems = FontAwesomeIconsService.getMisc().filter(ii => ii.name === misc);
     // For an unknown/invalid beneficiary, show 'other' symbol.
-    return matchingItems.length > 0 ? matchingItems[0].icon : faPlus;
+    return matchingItems[0] ? matchingItems[0].icon : faPlus;
   }
   static getSocialIcon(social) {
     const matchingItems = FontAwesomeIconsService.getSocials().filter(ii => ii.name === social);
     // For an unknown/invalid beneficiary, show 'other' symbol.
-    return matchingItems.length > 0 ? matchingItems[0].icon : faPlus;
+    return matchingItems[0] ? matchingItems[0].icon : faPlus;
   }
   static getCategoryIcon(category) {
     const matchingItems = FontAwesomeIconsService.getCategories().filter(ii => ii.name === category);
     // For an unknown/invalid category, show 'other' symbol.
-    return matchingItems.length > 0 ? matchingItems[0].icon : faPlus;
+    return matchingItems[0] ? matchingItems[0].icon : faPlus;
   }
 }
 

package/dist/types/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.d.ts

@@ -6,12 +6,12 @@ export declare class BiggiveCampaignCardFilterGrid {
    * component which handles it
    */
   doSearchAndFilterUpdate: EventEmitter<{
-    searchText: string;
-    sortBy: string;
-    filterCategory: string;
-    filterBeneficiary: string;
-    filterLocation: string;
-    filterFunding: string;
+    searchText: string | null;
+    sortBy: string | null;
+    filterCategory: string | null;
+    filterBeneficiary: string | null;
+    filterLocation: string | null;
+    filterFunding: string | null;
   }>;
   sortByPlaceholderText: string;
   beneficiariesPlaceHolderText: string;
@@ -34,7 +34,7 @@ export declare class BiggiveCampaignCardFilterGrid {
    * the search box text will clear, unless we use this prop to populate it on
    * rendering. DON-652.
    */
-  searchText: string;
+  searchText: string | null;
   /**
    * Defines the text displayed as the placeholder in the input field
    * before the user types anything
@@ -67,23 +67,23 @@ export declare class BiggiveCampaignCardFilterGrid {
    * two pages is loaded directly with URL parameters - in such a scenario the dropdown
    * shows that it's pre-selected. DON-558.
    */
-  selectedSortByOption: 'Most raised' | 'Match funds remaining' | 'Relevance';
+  selectedSortByOption: 'Most raised' | 'Match funds remaining' | 'Relevance' | null;
   /**
    * For injecting the chosen category to filter by, as per the comment above for `selectedSortByOption`.
    */
-  selectedFilterCategory: string;
+  selectedFilterCategory: string | null;
   /**
    * For injecting the chosen beneficiary to filter by, as per the comment above for `selectedSortByOption`.
    */
-  selectedFilterBeneficiary: string;
+  selectedFilterBeneficiary: string | null;
   /**
    * For injecting the chosen location to filter by, as per the comment above for `selectedSortByOption`.
    */
-  selectedFilterLocation: string;
+  selectedFilterLocation: string | null;
   /**
    * For injecting the chosen funding to filter by, as per the comment above for `selectedSortByOption`.
    */
-  selectedFilterFunding: string;
+  selectedFilterFunding: string | null;
   /**
    * State variable - causes re-render on change
    */

package/dist/types/components/biggive-form-field-select/biggive-form-field-select.d.ts

@@ -6,8 +6,8 @@ export declare class BiggiveFormFieldSelect {
    * component which handles it
    */
   doSelectChange: EventEmitter<object>;
-  selectedValue: string;
-  selectedLabel: string;
+  selectedValue: string | null;
+  selectedLabel: string | null;
   doOptionSelectCompletedHandler(event: any): void;
   /**
    * Space below component

package/dist/types/components/biggive-form-field-select-option/biggive-form-field-select-option.d.ts

@@ -5,8 +5,8 @@ export declare class BiggiveFormFieldSelectOption {
    * component which handles it
    */
   doOptionSelect: EventEmitter<object>;
-  selectedValue: string;
-  selectedLabel: string;
+  selectedValue: string | null;
+  selectedLabel: string | null;
   /**
    * Label
    */

package/dist/types/components.d.ts

@@ -442,27 +442,27 @@ export namespace Components {
         /**
           * Optional search text prop. Useful for pre-populating the search field when the page is loaded with a search term already existing in the URL. This can happen when sharing links, or if a donor goes to a campaign page after searching, and then returns to the search results. In such a case, the search box text will clear, unless we use this prop to populate it on rendering. DON-652.
          */
-        "searchText": string;
+        "searchText": string | null;
         /**
           * For injecting the chosen beneficiary to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterBeneficiary": string;
+        "selectedFilterBeneficiary": string | null;
         /**
           * For injecting the chosen category to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterCategory": string;
+        "selectedFilterCategory": string | null;
         /**
           * For injecting the chosen funding to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterFunding": string;
+        "selectedFilterFunding": string | null;
         /**
           * For injecting the chosen location to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterLocation": string;
+        "selectedFilterLocation": string | null;
         /**
           * This helps us inject a pre-selected dropdown value from outside of this component. This is especially helpful for the Meta campaign and Explore pages, where searching by text whipes out previous sort options and re-uses Relevance, or where one of those two pages is loaded directly with URL parameters - in such a scenario the dropdown shows that it's pre-selected. DON-558.
          */
-        "selectedSortByOption": 'Most raised' | 'Match funds remaining' | 'Relevance';
+        "selectedSortByOption": 'Most raised' | 'Match funds remaining' | 'Relevance' | null;
         /**
           * Space below component
          */
@@ -557,8 +557,8 @@ export namespace Components {
           * Placeholder
          */
         "placeholder": string;
-        "selectedLabel": string;
-        "selectedValue": string;
+        "selectedLabel": string | null;
+        "selectedValue": string | null;
         /**
           * Space below component
          */
@@ -1851,12 +1851,12 @@ declare namespace LocalJSX {
           * This event `doSearchAndFilterUpdate` event is emitted and propogates to the parent component which handles it
          */
         "onDoSearchAndFilterUpdate"?: (event: BiggiveCampaignCardFilterGridCustomEvent<{
-    searchText: string;
-    sortBy: string;
-    filterCategory: string;
-    filterBeneficiary: string;
-    filterLocation: string;
-    filterFunding: string;
+    searchText: string | null;
+    sortBy: string | null;
+    filterCategory: string | null;
+    filterBeneficiary: string | null;
+    filterLocation: string | null;
+    filterFunding: string | null;
   }>) => void;
         /**
           * Defines the text displayed as the placeholder in the input field before the user types anything
@@ -1865,27 +1865,27 @@ declare namespace LocalJSX {
         /**
           * Optional search text prop. Useful for pre-populating the search field when the page is loaded with a search term already existing in the URL. This can happen when sharing links, or if a donor goes to a campaign page after searching, and then returns to the search results. In such a case, the search box text will clear, unless we use this prop to populate it on rendering. DON-652.
          */
-        "searchText"?: string;
+        "searchText"?: string | null;
         /**
           * For injecting the chosen beneficiary to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterBeneficiary"?: string;
+        "selectedFilterBeneficiary"?: string | null;
         /**
           * For injecting the chosen category to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterCategory"?: string;
+        "selectedFilterCategory"?: string | null;
         /**
           * For injecting the chosen funding to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterFunding"?: string;
+        "selectedFilterFunding"?: string | null;
         /**
           * For injecting the chosen location to filter by, as per the comment above for `selectedSortByOption`.
          */
-        "selectedFilterLocation"?: string;
+        "selectedFilterLocation"?: string | null;
         /**
           * This helps us inject a pre-selected dropdown value from outside of this component. This is especially helpful for the Meta campaign and Explore pages, where searching by text whipes out previous sort options and re-uses Relevance, or where one of those two pages is loaded directly with URL parameters - in such a scenario the dropdown shows that it's pre-selected. DON-558.
          */
-        "selectedSortByOption"?: 'Most raised' | 'Match funds remaining' | 'Relevance';
+        "selectedSortByOption"?: 'Most raised' | 'Match funds remaining' | 'Relevance' | null;
         /**
           * Space below component
          */
@@ -1984,8 +1984,8 @@ declare namespace LocalJSX {
           * Placeholder
          */
         "placeholder"?: string;
-        "selectedLabel"?: string;
-        "selectedValue"?: string;
+        "selectedLabel"?: string | null;
+        "selectedValue"?: string | null;
         /**
           * Space below component
          */