@biggive/components 202606301318.0.0 → 202607280537.0.0

package/dist/collection/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.js

@@ -1,680 +0,0 @@
-import { h } from "@stencil/core";
-import { faMagnifyingGlass } from "@fortawesome/pro-solid-svg-icons";
-const sortOptionLabels = {
-    relevance: 'Relevance',
-    amountRaised: 'Most raised',
-    leastRaised: 'Least raised',
-    closeToTarget: 'Nearest target',
-    matchFundsRemaining: 'Most funds remaining',
-};
-export class BiggiveCampaignCardFilterGrid {
-    constructor() {
-        this.sortByPlaceholderText = 'Sort by';
-        this.beneficiariesPlaceHolderText = 'Select beneficiary';
-        this.categoriesPlaceHolderText = 'Select category';
-        this.locationsPlaceHolderText = 'Select location';
-        /**
-         * This and similar properties represent selections made in the popup but not yet applied.
-         */
-        this.newSelectedFilterCategory = null;
-        this.newSelectedFilterBeneficiary = null;
-        this.newSelectedFilterLocation = null;
-        /**
-         * Space below component
-         */
-        this.spaceBelow = 0;
-        /**
-         * Intro
-         */
-        this.intro = 'Find a charity or project';
-        /**
-         * 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.
-         */
-        this.searchText = null;
-        /**
-         * Defines the text displayed as the placeholder in the input field
-         * before the user types anything
-         */
-        this.placeholderText = 'Search';
-        /**
-         * Defines the text on the search button
-         */
-        this.buttonText = 'Search';
-        /**
-         * For injecting the chosen category to filter by, as per the comment above for `selectedSortByOption`.
-         */
-        this.selectedFilterCategory = null;
-        /**
-         * For injecting the chosen beneficiary to filter by, as per the comment above for `selectedSortByOption`.
-         */
-        this.selectedFilterBeneficiary = null;
-        /**
-         * For injecting the chosen location to filter by, as per the comment above for `selectedSortByOption`.
-         */
-        this.selectedFilterLocation = null;
-        /**
-         * Allow donors to select campaigns near to themselves.
-         */
-        this.enableSearchByLocation = false;
-        /**
-         * Incidates that the component is currently fetching the browser location
-         */
-        this.fetchingLocation = false;
-        /**
-         * Selected location around which donor is looking for campaigns
-         */
-        this.location = undefined;
-        this.categoryFilterSelectionChanged = (value) => {
-            this.newSelectedFilterCategory = value;
-        };
-        this.beneficiarySelectionChanged = (value) => {
-            this.newSelectedFilterBeneficiary = value;
-        };
-        this.locationSelectionChanged = (value) => {
-            this.newSelectedFilterLocation = value;
-        };
-        this.sortBySelectionChanged = (value) => {
-            this.selectedSortByOption = value;
-            this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
-        };
-        this.handleApplyFilterButtonClick = () => {
-            var _a, _b, _c, _d;
-            this.selectedFilterCategory = (_a = this.newSelectedFilterCategory) !== null && _a !== void 0 ? _a : this.selectedFilterCategory;
-            this.selectedFilterBeneficiary = (_b = this.newSelectedFilterBeneficiary) !== null && _b !== void 0 ? _b : this.selectedFilterBeneficiary;
-            this.selectedFilterLocation = (_c = this.newSelectedFilterLocation) !== null && _c !== void 0 ? _c : this.selectedFilterLocation;
-            const searchAndFilterObj = this.getSearchAndFilterObject();
-            this.doSearchAndFilterUpdate.emit(searchAndFilterObj);
-            const filterPopup = (_d = this.el.shadowRoot) === null || _d === void 0 ? void 0 : _d.getElementById('filter-popup');
-            if (filterPopup) {
-                filterPopup.closeFromOutside();
-            }
-            this.filtersApplied =
-                typeof searchAndFilterObj.filterBeneficiary === 'string' || typeof searchAndFilterObj.filterCategory === 'string' || typeof searchAndFilterObj.filterLocation === 'string';
-        };
-        this.handleSearchButtonPressed = () => {
-            this.unfocusTextInput();
-            this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
-            if (this.hasSearchTerm()) {
-                this.selectedSortByOption = 'Relevance';
-            }
-        };
-        this.handleNearMeButtonPressed = () => {
-            this.unfocusTextInput();
-            this.doGetLocationFromBrowser.emit();
-        };
-        this.handleSearchTextChanged = (event) => {
-            this.searchText = event.target.value;
-        };
-        this.handleEnterPressed = (ev) => {
-            if (ev.key === 'Enter') {
-                this.unfocusTextInput();
-                this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
-            }
-        };
-        this.handleFilterButtonClick = () => {
-            var _a;
-            this.newSelectedFilterBeneficiary = this.selectedFilterBeneficiary;
-            this.newSelectedFilterCategory = this.selectedFilterCategory;
-            this.newSelectedFilterLocation = this.selectedFilterLocation;
-            const filterPopup = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById('filter-popup');
-            if (filterPopup) {
-                filterPopup.openFromOutside();
-            }
-        };
-        this.handleClearAll = () => {
-            var _a;
-            this.unfocusTextInput();
-            // Set the 'Filters' button back to the primary background colour
-            this.filtersApplied = false;
-            // Clear all
-            this.searchText = null;
-            this.selectedSortByOption = this.initialSortByOption;
-            this.selectedFilterBeneficiary = null;
-            this.selectedFilterCategory = null;
-            this.selectedFilterLocation = null;
-            // Clear <biggive-form-field-select> components' internal selectedValue and selectedLabel. DON-654.
-            ['sort-by', 'categories', 'beneficiaries', 'locations', 'funding'].forEach(id => {
-                var _a;
-                const theEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById(id);
-                if (!theEl) {
-                    return;
-                }
-                theEl.selectedValue = null;
-                theEl.selectedLabel = null;
-            });
-            const selectedFilters = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.selected-filters');
-            if (selectedFilters) {
-                selectedFilters.querySelectorAll('.button').forEach(button => {
-                    button.remove();
-                });
-            }
-            // Emit the doSearchAndFilterUpdate event with null values. DON-654
-            this.doSearchAndFilterUpdate.emit({
-                searchText: null,
-                sortBy: null,
-                filterCategory: null,
-                filterBeneficiary: null,
-                filterLocation: null,
-            });
-        };
-    }
-    /**
-     * Typically on non-negligible scroll away from the search area.
-     */
-    async unfocusInputs() {
-        this.unfocusTextInput();
-    }
-    getSearchAndFilterObject() {
-        return {
-            searchText: this.searchText,
-            sortBy: this.selectedSortByOption,
-            filterCategory: this.selectedFilterCategory,
-            filterBeneficiary: this.selectedFilterBeneficiary,
-            filterLocation: this.selectedFilterLocation,
-        };
-    }
-    removeFilter(filterKey) {
-        var _a;
-        switch (filterKey) {
-            case 'beneficiaries':
-                this.selectedFilterBeneficiary = null;
-                break;
-            case 'categories':
-                this.selectedFilterCategory = null;
-                break;
-            case 'locations':
-                this.selectedFilterLocation = null;
-                break;
-            default:
-                // This asks the compiler to check that we are in dead code, i.e. we covered all the possible filter keys
-                // above. If we missed one we would get a compile error trying to assign a string to a never.
-                const exhaustiveSwitch = filterKey;
-                console.error(exhaustiveSwitch);
-        }
-        const selectEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById(filterKey);
-        if (!selectEl) {
-            return;
-        }
-        selectEl.selectedLabel = null;
-        selectEl.selectedValue = null;
-        this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
-    }
-    /**
-     * We've seen desktop Safari jump to this input when it's focused at times when that's
-     * unhelpful, so on a few occasions we proactively blur it.
-     */
-    unfocusTextInput() {
-        var _a;
-        const input = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.input-text');
-        input === null || input === void 0 ? void 0 : input.blur();
-    }
-    componentWillRender() {
-        this.filtersApplied = this.selectedFilterCategory !== null || this.selectedFilterBeneficiary !== null || this.selectedFilterLocation !== null;
-        this.initialSortByOption = this.selectedSortByOption;
-    }
-    render() {
-        var _a;
-        const sortOptions = this.getSortOptions();
-        return (h("div", { key: 'ceb2f44c3c853bfdc3da18ad187de4cc5a085ffb', class: 'container space-below-' + this.spaceBelow }, h("div", { key: '8f6370902bfabe8a9df23e274d05298ca316b12b', class: "sleeve" }, h("div", { key: '89fc861fdb61827ab5dbb5cee88a4dfdd0a8abcb', class: "search-wrap" }, h("h4", { key: '04363e5852c2347036e52efd75c0acfd83df5901' }, this.intro), h("div", { key: 'dd18cb11be900192f0a5a26f027b0102453e50ad', class: "field-wrap" }, h("div", { key: 'a9798f3d6943cfb5494452bf23ea5ce03c288a45', class: "input-wrap" }, h("svg", { key: '9296bccad620aaba713b252fb31c7f3efd4b1a96', xmlns: "http://www.w3.org/2000/svg", class: "icon", viewBox: "0 0 512 512" }, h("path", { key: '718a7766577cf08ba55ebae64b60b312cfcf8edf', d: faMagnifyingGlass.icon[4].toString() })), h("input", { key: 'e89ff0c306417359e72597edf932166970e01702', type: "text", value: (_a = this.searchText) !== null && _a !== void 0 ? _a : '', class: "input-text", placeholder: this.placeholderText, onInput: this.handleSearchTextChanged, onKeyDown: this.handleEnterPressed })), h("biggive-button", { key: '7713463cc5c611be7e96290c91da7691c3bba5e4', onDoButtonClick: this.handleSearchButtonPressed, label: this.buttonText }))), h("div", { key: 'eb4ac758e446eda26be72dad7239fd525c520c39', class: "sort-filter-wrap" }, this.enableSearchByLocation && this.offerNearMeOption && (h("biggive-button", { key: '6f571b4193453203cc11cb99c42a475e0360b69d', class: "filter", colourScheme: "primary", onDoButtonClick: this.handleNearMeButtonPressed, label: this.fetchingLocation ? 'Fetching location...' : 'Charities near me', disabled: this.fetchingLocation, fullWidth: true, "space-below": "0" })), h("div", { key: '07fa78bea86edf2b60492b42e8e91ff9b44e9830', class: "filter-wrap" }, h("biggive-button", { key: '0f6775e87d80f1b91dd57ef39260838932dd099d', class: "filter", colourScheme: "primary", onDoButtonClick: this.handleFilterButtonClick, label: "Filter", fullWidth: true, "space-below": "0" }), h("biggive-popup", { key: 'fe87d7b2fc75583f421855eee6dd22132ec77096', id: "filter-popup" }, h("h4", { key: '50cc5ea69df122c34ff8bc615088f7a7e07d992e', class: "space-above-0 space-below-3 text-colour-primary" }, "Filters"), h("div", { key: 'c0354b38830bb635e19ad38dfd306e41b72aedff', class: "select-wrapper-1" }, h("biggive-form-field-select", { key: 'a1ce6c7b5c956e01958a74f98d6a1238486dd511', backgroundColour: "white", prompt: "Category", placeholder: this.categoriesPlaceHolderText, selectedLabel: this.selectedFilterCategory, selectedValue: this.selectedFilterCategory, options: this.optionsToArray(this.categoryOptions || []), selectionChanged: this.categoryFilterSelectionChanged, id: "categories", "space-below": "2" })), h("div", { key: '6cc0dbeb1c98470bdce24faf880210f64e0edd72', class: "select-wrapper-2" }, h("biggive-form-field-select", { key: '5109c83967e666a5254814ddaf822cffbda2b6af', backgroundColour: "white", prompt: "Beneficiary", placeholder: this.beneficiariesPlaceHolderText, selectedLabel: this.selectedFilterBeneficiary, selectedValue: this.selectedFilterBeneficiary, options: this.optionsToArray(this.beneficiaryOptions || []), selectionChanged: this.beneficiarySelectionChanged, id: "beneficiaries", "space-below": "2" })), h("div", { key: '213fb6972e212a3ed593445701e55cd9c9df4e70', class: "select-wrapper-3" }, h("biggive-form-field-select", { key: 'c5f0c913deb5b3eb1cdde23cc4f59fd4d856bdc7', backgroundColour: "white", prompt: "Location", placeholder: this.locationsPlaceHolderText, selectedLabel: this.selectedFilterLocation, selectedValue: this.selectedFilterLocation, options: this.optionsToArray(this.locationOptions || []), selectionChanged: this.locationSelectionChanged, id: "locations", "space-below": "2" })), h("div", { key: 'd5ebed141c6f2df713044838802e41d59a99c033', class: "align-right" }, h("biggive-button", { key: '5fe81bf0b04ef44618264aa4dae4b31df44f74c2', label: "Apply filters", onDoButtonClick: this.handleApplyFilterButtonClick })))), h("div", { key: '36cbb004dc2c0b3d6435c853893f279f7cc2a0b4', class: "sort-wrap" }, h("biggive-form-field-select", { key: 'ce1b686a810d10452ef1c2fabf346117cd3990c4', options: sortOptions, prompt: null, "select-style": "underlined", placeholder: this.sortByPlaceholderText, selectedLabel: this.selectedSortByOption, selectedValue: this.getSelectedValue(), selectionChanged: this.sortBySelectionChanged, id: "sort-by" }, h("biggive-form-field-select-option", { key: 'eb016dccffc6b0c63de001ec5e7c15c0215f58f7', value: "amountRaised", label: "Most raised" }), h("biggive-form-field-select-option", { key: '4df7ba1f42d0bb2d1e53c2e40db788bc4862ffed', value: "leastRaised", label: "Least raised" }), h("biggive-form-field-select-option", { key: '6ee1373b12f664ffc9b2d86fbfae71c5ee89c808', value: "matchFundsRemaining", label: "Most funds remaining" }), h("biggive-form-field-select-option", { key: 'e2cf6339701f3f03fd1a1a1ddd55a697db189b64', value: "closeToTarget", label: "Nearest target" }), (this.searchText || '').length > 0 ? h("biggive-form-field-select-option", { value: "Relevance", label: "Relevance" }) : null))), h("div", { key: 'f6e3bf0f207f735c91b9053f43b1a75a6ec33b34', class: "selected-filter-wrap" }, h("div", { key: 'bfdbb504e478326031d977b1af88f2cc74d2f841', class: "selected-filters" }, this.selectedFilterCategory && (h("span", { key: 'bbb0ea75b53fed704a910faa8962bd9f70454b25', class: "button", onClick: () => {
-                this.removeFilter('categories');
-            } }, this.selectedFilterCategory)), this.selectedFilterBeneficiary && (h("span", { key: '5d391afc2dfd66119892f7b77038125e5703728e', class: "button", onClick: () => {
-                this.removeFilter('beneficiaries');
-            } }, this.selectedFilterBeneficiary)), this.selectedFilterLocation && (h("span", { key: 'bc7b957d2d76cdfede96921c0a006da77690b3fc', class: "button", onClick: () => {
-                this.removeFilter('locations');
-            } }, this.selectedFilterLocation))), h("div", { key: 'bf228470ec15507617fa98b20eda6b2584ca359d', class: "clear-all" }, h("a", { key: '5e210df20d0dc4951b98888958d03ff0ed74cf0c', onClick: this.handleClearAll }, "Clear all"))), h("div", { key: '155ef43b9888223f6a480130df3aa47bafd78741', class: "campaign-grid" }, h("slot", { key: 'ee3ff728b4ce9a11e33401236ccee3a581ef39a0', name: "campaign-grid" })))));
-    }
-    // I'm not sure if I understand the reasoning for own-methods-must-be-private. I made the method below public to unit
-    // test it. Maybe the idea is that we should move anything with enough logic to test outside the component class? I
-    // can do that if people think it's better.
-    //
-    // eslint-disable-next-line @stencil-community/own-methods-must-be-private
-    getSelectedValue() {
-        const sortByOption = this.selectedSortByOption;
-        if (sortByOption === undefined) {
-            return undefined;
-        }
-        const sortOptions = this.getSortOptions();
-        const selected = sortOptions.filter(option => {
-            return option.label.toLowerCase() === sortByOption.toLowerCase();
-        })[0];
-        return selected === null || selected === void 0 ? void 0 : selected.value;
-    }
-    getSortOptions() {
-        // @ts-ignore  - see https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208
-        const sortOptionKeys = Object.getOwnPropertyNames(sortOptionLabels);
-        const relevantOptionKeys = sortOptionKeys.filter(key => key !== 'relevance' || this.hasSearchTerm());
-        return relevantOptionKeys.map((key) => ({ value: key, label: sortOptionLabels[key] }));
-    }
-    hasSearchTerm() {
-        return typeof this.searchText === 'string' && this.searchText.length > 0;
-    }
-    optionsToArray(options) {
-        if (typeof options === 'string') {
-            options = JSON.parse(options);
-        }
-        if (Array.isArray(options)) {
-            return options.map((option) => ({ value: option, label: option }));
-        }
-        return Object.entries(options).map(entry => ({ value: entry[0], label: entry[1] }));
-    }
-    static get is() { return "biggive-campaign-card-filter-grid"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["biggive-campaign-card-filter-grid.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["biggive-campaign-card-filter-grid.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "spaceBelow": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Space below component"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "space-below",
-                "defaultValue": "0"
-            },
-            "intro": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Intro"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "intro",
-                "defaultValue": "'Find a charity or project'"
-            },
-            "searchText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "null | string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Optional search text prop. Useful for pre-populating the search field\nwhen the page is loaded with a search term already existing in the URL.\nThis can happen when sharing links, or if a donor goes to a campaign page\nafter searching, and then returns to the search results. In such a case,\nthe search box text will clear, unless we use this prop to populate it on\nrendering. DON-652."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "search-text",
-                "defaultValue": "null"
-            },
-            "placeholderText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Defines the text displayed as the placeholder in the input field\nbefore the user types anything"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "placeholder-text",
-                "defaultValue": "'Search'"
-            },
-            "buttonText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Defines the text on the search button"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "button-text",
-                "defaultValue": "'Search'"
-            },
-            "categoryOptions": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Record<string, string> | string[]",
-                    "resolved": "string | string[]",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "JSON array of category key/values, or takes a stringified equiavalent (for Storybook)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "category-options"
-            },
-            "beneficiaryOptions": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Record<string, string> | string[]",
-                    "resolved": "string | string[]",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "JSON array of beneficiary key/values, or takes a stringified equiavalent (for Storybook)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "beneficiary-options"
-            },
-            "locationOptions": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Record<string, string> | string[]",
-                    "resolved": "string | string[]",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "JSON array of location key/values, or takes a stringified equiavalent (for Storybook)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "location-options"
-            },
-            "selectedSortByOption": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "sortOptionLabel",
-                    "resolved": "\"Least raised\" | \"Most funds remaining\" | \"Most raised\" | \"Nearest target\" | \"Relevance\"",
-                    "references": {
-                        "sortOptionLabel": {
-                            "location": "local",
-                            "path": "/home/circleci/components/src/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.tsx",
-                            "id": "src/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.tsx::sortOptionLabel"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "This helps us inject a pre-selected dropdown value from outside of this component.\nThis is especially helpful for the Meta campaign and Explore pages, where searching\nby text wipes out previous sort options and re-uses Relevance, or where one of those\ntwo pages is loaded directly with URL parameters - in such a scenario the dropdown\nshows that it's pre-selected. DON-558."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected-sort-by-option"
-            },
-            "selectedFilterCategory": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "null | string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "For injecting the chosen category to filter by, as per the comment above for `selectedSortByOption`."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected-filter-category",
-                "defaultValue": "null"
-            },
-            "selectedFilterBeneficiary": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "null | string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "For injecting the chosen beneficiary to filter by, as per the comment above for `selectedSortByOption`."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected-filter-beneficiary",
-                "defaultValue": "null"
-            },
-            "selectedFilterLocation": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "null | string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "For injecting the chosen location to filter by, as per the comment above for `selectedSortByOption`."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected-filter-location",
-                "defaultValue": "null"
-            },
-            "enableSearchByLocation": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Allow donors to select campaigns near to themselves."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "enable-search-by-location",
-                "defaultValue": "false"
-            },
-            "offerNearMeOption": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Allow donors to select campaigns/charities near to themselves."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "offer-near-me-option"
-            },
-            "fetchingLocation": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Incidates that the component is currently fetching the browser location"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "fetching-location",
-                "defaultValue": "false"
-            },
-            "location": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "GeolocationPosition | undefined",
-                    "resolved": "GeolocationPosition | undefined",
-                    "references": {
-                        "GeolocationPosition": {
-                            "location": "global",
-                            "id": "global::GeolocationPosition"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Selected location around which donor is looking for campaigns"
-                },
-                "getter": false,
-                "setter": false,
-                "defaultValue": "undefined"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "filtersApplied": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "doSearchAndFilterUpdate",
-                "name": "doSearchAndFilterUpdate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "This event `doSearchAndFilterUpdate` event is emitted and propogates to the parent\ncomponent which handles it"
-                },
-                "complexType": {
-                    "original": "{\n    searchText: string | null;\n    sortBy: string | null;\n    filterCategory: string | null;\n    filterBeneficiary: string | null;\n    filterLocation: string | null;\n  }",
-                    "resolved": "{ searchText: string | null; sortBy: string | null; filterCategory: string | null; filterBeneficiary: string | null; filterLocation: string | null; }",
-                    "references": {}
-                }
-            }, {
-                "method": "doGetLocationFromBrowser",
-                "name": "doGetLocationFromBrowser",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "This event `doSearchAndFilterUpdate` event is emitted and propogates to the parent\ncomponent which handles it"
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }];
-    }
-    static get methods() {
-        return {
-            "unfocusInputs": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Typically on non-negligible scroll away from the search area.",
-                    "tags": []
-                }
-            }
-        };
-    }
-    static get elementRef() { return "el"; }
-}