@mycause/ui 1.0.1 → 1.0.2

package/dist/index.esm.js

@@ -29645,4 +29645,187 @@ InputSocial.propTypes = {
   icon: _pt.element
 };
 
-export { Anchor, Avatar, BoldAnchor, Box, Button, ButtonSelect, CampaignCard, CampaignOfMonth, CharityCard, Checkbox, Chip, Chips, ComboField, ComboFieldExpander, CommentSection, CommentSectionV2, Cropper, CustomHeaderSingleDatePicker, DatePicker, DonateCard, DonationForm, DonationFormV2, Elevation, FavoriteCharityItem, FeaturedCampaignCard, FieldHelperText, FieldLabel, Flex, FooterV2, FundraisingSection, Grid, HeartToggle, HeroBnner as HeroBanner, HorizontalBar, Icon, IconButton, IconButtonGroup, Input, InputChips, InputSocial, List, Login, MENU_ANCHOR_CLASS, Menu, MenuList, ListDivider as MenuListDivider, MenuListItem, MenuListItemGraphic, ListItemMeta as MenuListItemMeta, MenuListItemText, MenuSurface, Modal, ModalImage, MyAccountChooseCharityCard, MyAccountFrpClosed, MyAccountFrpPreview, MyAccountSidebar, MyAccountStartFundraiseCard, MyAccountStatsDonated, MyAccountStatsRaised, MyCauseTheme, Navigation$1 as Nav, Navigation$2 as NavMyAccount, Navigation, PartnerChartStats, PartnerMonthlyDonations, PartnerMonthlyStats, PartnerMonthlyTable, PartnerToggleButton, PartnerToggleButtonBlock, PhoneInput, PhoneNumberInput, PhoneNumberInputV1, Popup, ProgressBar, Radio, RadioGroup, Select, SelectV2 as SelectEnhanced, SelectHelperText, SelectV2$1 as SelectV2, CustomSingleDatePicker as SingleDatePicker, Spinner, Stack, StartCampaignCard, Statistics, Switch, SwitchV2, Tabs, Text, TextField, HelperText as TextFieldHelperText, TextFieldSearch, ThemeContext, ThemeProvider, ThisMonthCard, Toast, TransactionCard, Uploader, getColorToken, parseNationalPhoneNumber, useTheme };
+var cls$A = {"wrapper":"charity-tags-filter-button-module_wrapper__3DcoL","charity_tags_filter_button":"charity-tags-filter-button-module_charity_tags_filter_button__3Hgmd","filter_button":"charity-tags-filter-button-module_filter_button__JYmzm","filter_layout":"charity-tags-filter-button-module_filter_layout__1qFH5","filter_layout_title":"charity-tags-filter-button-module_filter_layout_title__cjG4v","filter_layout_options":"charity-tags-filter-button-module_filter_layout_options__3176V"};
+
+function FilterIcon(props) {
+  const {
+    color
+  } = props;
+  return /*#__PURE__*/React.createElement("svg", {
+    width: "25",
+    height: "24",
+    viewBox: "0 0 25 24",
+    fill: color || "#FFFFFF",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M18.1538 19.6538C17.2169 19.6538 16.425 19.3303 15.778 18.6835C15.1312 18.0365 14.8077 17.2446 14.8077 16.3078C14.8077 15.3708 15.1312 14.5788 15.778 13.932C16.425 13.285 17.2169 12.9615 18.1538 12.9615C19.0908 12.9615 19.8827 13.285 20.5295 13.932C21.1765 14.5788 21.5 15.3708 21.5 16.3078C21.5 17.2446 21.1765 18.0365 20.5295 18.6835C19.8827 19.3303 19.0908 19.6538 18.1538 19.6538ZM18.1528 18.1538C18.6624 18.1538 19.0977 17.9737 19.4587 17.6135C19.8196 17.2532 20 16.8183 20 16.3088C20 15.7991 19.8198 15.3638 19.4595 15.0028C19.0993 14.6419 18.6644 14.4615 18.1547 14.4615C17.6451 14.4615 17.2098 14.6417 16.849 15.002C16.4882 15.3622 16.3077 15.7971 16.3077 16.3068C16.3077 16.8164 16.4878 17.2517 16.848 17.6125C17.2083 17.9733 17.6432 18.1538 18.1528 18.1538ZM5 17.0578V15.5578H12.6155V17.0578H5ZM6.84625 11.0385C5.90925 11.0385 5.11733 10.715 4.4705 10.068C3.8235 9.42117 3.5 8.62925 3.5 7.69225C3.5 6.75542 3.8235 5.9635 4.4705 5.3165C5.11733 4.66967 5.90925 4.34625 6.84625 4.34625C7.78308 4.34625 8.575 4.66967 9.222 5.3165C9.86883 5.9635 10.1923 6.75542 10.1923 7.69225C10.1923 8.62925 9.86883 9.42117 9.222 10.068C8.575 10.715 7.78308 11.0385 6.84625 11.0385ZM6.84525 9.5385C7.35492 9.5385 7.79017 9.35834 8.151 8.998C8.51183 8.63784 8.69225 8.20292 8.69225 7.69325C8.69225 7.18359 8.51217 6.74834 8.152 6.3875C7.79167 6.02667 7.35675 5.84625 6.84725 5.84625C6.33758 5.84625 5.90225 6.02634 5.54125 6.3865C5.18042 6.74684 5 7.18175 5 7.69125C5 8.20092 5.18017 8.63625 5.5405 8.99725C5.90067 9.35809 6.33558 9.5385 6.84525 9.5385ZM12.3845 8.44225V6.94225H20V8.44225H12.3845Z",
+    fill: color || "#FFFFFF"
+  }));
+}
+FilterIcon.propTypes = {
+  color: _pt.string
+};
+
+const CharityTagsFilterButton = _ref => {
+  let {
+    btnIcon,
+    btnText,
+    states,
+    categories,
+    onChange,
+    className,
+    classNameBtn,
+    buttonStyle,
+    activeButtonColor = "#E7684B",
+    classNameFilterLayout,
+    checkBoxStyle = {
+      foreground: "#FF7658",
+      background: "#FFFFFF"
+    },
+    activeColor = "#FDF9F1",
+    maxStatesSelected,
+    maxCategoriesSelected,
+    tagsSelected
+  } = _ref;
+  const filterIcon = btnIcon || /*#__PURE__*/React.createElement(FilterIcon, null);
+  const btnTextContent = btnText || "Filter";
+  const [filterPanelOpen, setFilterPanelOpen] = useState(false);
+  const defaultStyle = {
+    fontFamily: "Montserrat, sans-serif",
+    fontSize: "16px",
+    fontWeight: 600,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: "8px",
+    color: "#FFFFFF",
+    backgroundColor: "#FF7658",
+    cursor: "pointer",
+    border: "none",
+    padding: "18px 24px",
+    borderRadius: "8px",
+    transition: "background-color 0.3s"
+  };
+  const combinedStyle = _objectSpread2(_objectSpread2({}, defaultStyle), buttonStyle);
+  const handleTogglePanel = () => {
+    setFilterPanelOpen(!filterPanelOpen);
+  };
+  const handleToggleState = value => {
+    const {
+      locations: originalLocation,
+      categories
+    } = tagsSelected;
+    const locations = originalLocation.includes(value) ? originalLocation.filter(_i => _i !== value) : [...originalLocation, value];
+    const newTagsSelected = {
+      locations,
+      categories
+    };
+    onChange(newTagsSelected);
+  };
+  const handleToggleCategory = value => {
+    const {
+      locations,
+      categories: originalCategories
+    } = tagsSelected;
+    const categories = originalCategories.includes(value) ? originalCategories.filter(_i => _i !== value) : [...originalCategories, value];
+    const newTagsSelected = {
+      locations,
+      categories
+    };
+    onChange(newTagsSelected);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.wrapper, className) || "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.charity_tags_filter_button )
+  }, /*#__PURE__*/React.createElement("div", {
+    onClick: handleTogglePanel,
+    style: _objectSpread2(_objectSpread2({}, combinedStyle), {}, {
+      backgroundColor: filterPanelOpen ? activeButtonColor : combinedStyle.backgroundColor
+    }),
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.filter_button, classNameBtn) || "")
+  }, /*#__PURE__*/React.createElement("span", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]])
+  }, filterIcon), btnTextContent)), filterPanelOpen && /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.filter_layout, classNameFilterLayout) || "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + ( "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_title )
+  }, "Location/s"), /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_options )
+  }, states.map((_state, index) => {
+    const active = tagsSelected.locations.includes(_state.value);
+    const maxSelectedReached = maxStatesSelected ? tagsSelected.locations.length >= maxStatesSelected : false;
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames("state_item", {
+        active: active
+      }) || "")
+    }, /*#__PURE__*/React.createElement(Checkbox, {
+      key: index,
+      label: _state.value,
+      onChange: () => {
+        handleToggleState(_state.value);
+      },
+      checked: active,
+      disabled: maxSelectedReached && !active,
+      color: checkBoxStyle
+    }));
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + ( "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_title )
+  }, "Category"), /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_options )
+  }, categories.map((_category, index) => {
+    const active = tagsSelected.categories.includes(_category.id);
+    const maxSelectedReached = maxCategoriesSelected ? tagsSelected.categories.length >= maxCategoriesSelected : false;
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames("category_item", {
+        active
+      }) || "")
+    }, /*#__PURE__*/React.createElement(Checkbox, {
+      key: index,
+      label: _category.name,
+      onChange: () => {
+        handleToggleCategory(_category.id);
+      },
+      checked: active,
+      disabled: maxSelectedReached && !active,
+      color: checkBoxStyle
+    }));
+  }))), /*#__PURE__*/React.createElement(Button, {
+    color: checkBoxStyle,
+    onClick: () => setFilterPanelOpen(false)
+  }, "Close")), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "2734352145",
+    dynamic: [activeColor, checkBoxStyle.foreground]
+  }, ".active.__jsx-style-dynamic-selector{background-color:".concat(activeColor, ";border-radius:8px;}.mdc-checkbox__native-control:enabled:checked ~ .mdc-checkbox__background{background-color:transparent !important;}.mdc-checkbox__checkmark{color:").concat(checkBoxStyle.foreground, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNoYXJpdHktdGFncy1maWx0ZXItYnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtTGtCLEFBR3lELEFBS04sQUFHTCxtQ0FDckMsS0FIQSxNQUxvQixrQkFDcEIiLCJmaWxlIjoiY2hhcml0eS10YWdzLWZpbHRlci1idXR0b24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgY24gZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBjbHMgZnJvbSBcIi4vY2hhcml0eS10YWdzLWZpbHRlci1idXR0b24ubW9kdWxlLnNjc3NcIjtcbmltcG9ydCBCdXR0b24gZnJvbSBcIi4uL2J1dHRvbi9idXR0b25cIjtcbmltcG9ydCBDaGVja2JveCBmcm9tIFwiLi4vY2hlY2tib3gvY2hlY2tib3hcIjtcbmltcG9ydCB7IEZpbHRlckljb24gfSBmcm9tIFwiLi9GaWx0ZXJJY29uXCI7XG5cbmV4cG9ydCB0eXBlIENoYXJpdHlUYWdzU2VsZWN0ZWQgPSB7XG4gIGxvY2F0aW9uczogQXJyYXk8c3RyaW5nPjtcbiAgY2F0ZWdvcmllczogQXJyYXk8bnVtYmVyPjtcbn07XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b25Qcm9wcyB7XG4gIGJ0bkljb24/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIGJ0blRleHQ/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIHN0YXRlczogQXJyYXk8eyB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyOyBsYWJlbDogc3RyaW5nIH0+O1xuICBjYXRlZ29yaWVzOiBBcnJheTx7IGlkOiBudW1iZXIgfCBzdHJpbmc7IG5hbWU6IHN0cmluZyB9PjtcbiAgb25DaGFuZ2U6ICh0YWdTZWxlY3RlZDogQ2hhcml0eVRhZ3NTZWxlY3RlZCkgPT4gdm9pZDtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBjbGFzc05hbWVCdG4/OiBzdHJpbmc7XG4gIGJ1dHRvblN0eWxlPzogb2JqZWN0O1xuICBhY3RpdmVCdXR0b25Db2xvcj86IHN0cmluZztcbiAgY2xhc3NOYW1lRmlsdGVyTGF5b3V0Pzogc3RyaW5nO1xuICBjaGVja0JveFN0eWxlPzogeyBmb3JlZ3JvdW5kOiBzdHJpbmc7IGJhY2tncm91bmQ6IHN0cmluZyB9O1xuICBhY3RpdmVDb2xvcj86IHN0cmluZztcbiAgbWF4U3RhdGVzU2VsZWN0ZWQ/OiBudW1iZXI7XG4gIG1heENhdGVnb3JpZXNTZWxlY3RlZD86IG51bWJlcjtcbiAgdGFnc1NlbGVjdGVkOiBDaGFyaXR5VGFnc1NlbGVjdGVkO1xufVxuXG5jb25zdCBDaGFyaXR5VGFnc0ZpbHRlckJ1dHRvbiA9ICh7XG4gIGJ0bkljb24sXG4gIGJ0blRleHQsXG4gIHN0YXRlcyxcbiAgY2F0ZWdvcmllcyxcbiAgb25DaGFuZ2UsXG4gIGNsYXNzTmFtZSxcbiAgY2xhc3NOYW1lQnRuLFxuICBidXR0b25TdHlsZSxcbiAgYWN0aXZlQnV0dG9uQ29sb3IgPSBcIiNFNzY4NEJcIixcbiAgY2xhc3NOYW1lRmlsdGVyTGF5b3V0LFxuICBjaGVja0JveFN0eWxlID0geyBmb3JlZ3JvdW5kOiBcIiNGRjc2NThcIiwgYmFja2dyb3VuZDogXCIjRkZGRkZGXCIgfSxcbiAgYWN0aXZlQ29sb3IgPSBcIiNGREY5RjFcIixcbiAgbWF4U3RhdGVzU2VsZWN0ZWQsXG4gIG1heENhdGVnb3JpZXNTZWxlY3RlZCxcbiAgdGFnc1NlbGVjdGVkLFxufTogQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b25Qcm9wcykgPT4ge1xuICBjb25zdCBmaWx0ZXJJY29uID0gYnRuSWNvbiB8fCA8RmlsdGVySWNvbiAvPjtcbiAgY29uc3QgYnRuVGV4dENvbnRlbnQgPSBidG5UZXh0IHx8IFwiRmlsdGVyXCI7XG4gIGNvbnN0IFtmaWx0ZXJQYW5lbE9wZW4sIHNldEZpbHRlclBhbmVsT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgZGVmYXVsdFN0eWxlID0ge1xuICAgIGZvbnRGYW1pbHk6IFwiTW9udHNlcnJhdCwgc2Fucy1zZXJpZlwiLFxuICAgIGZvbnRTaXplOiBcIjE2cHhcIixcbiAgICBmb250V2VpZ2h0OiA2MDAsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICBnYXA6IFwiOHB4XCIsXG4gICAgY29sb3I6IFwiI0ZGRkZGRlwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogXCIjRkY3NjU4XCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgIHBhZGRpbmc6IFwiMThweCAyNHB4XCIsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjhweFwiLFxuICAgIHRyYW5zaXRpb246IFwiYmFja2dyb3VuZC1jb2xvciAwLjNzXCIsXG4gIH07XG5cbiAgY29uc3QgY29tYmluZWRTdHlsZSA9IHsgLi4uZGVmYXVsdFN0eWxlLCAuLi5idXR0b25TdHlsZSB9O1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZVBhbmVsID0gKCkgPT4ge1xuICAgIHNldEZpbHRlclBhbmVsT3BlbighZmlsdGVyUGFuZWxPcGVuKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVUb2dnbGVTdGF0ZSA9ICh2YWx1ZTogc3RyaW5nKSA9PiB7XG4gICAgY29uc3QgeyBsb2NhdGlvbnM6IG9yaWdpbmFsTG9jYXRpb24sIGNhdGVnb3JpZXMgfSA9IHRhZ3NTZWxlY3RlZDtcbiAgICBjb25zdCBsb2NhdGlvbnMgPSBvcmlnaW5hbExvY2F0aW9uLmluY2x1ZGVzKHZhbHVlKVxuICAgICAgPyBvcmlnaW5hbExvY2F0aW9uLmZpbHRlcihfaSA9PiBfaSAhPT0gdmFsdWUpXG4gICAgICA6IFsuLi5vcmlnaW5hbExvY2F0aW9uLCB2YWx1ZV07XG4gICAgY29uc3QgbmV3VGFnc1NlbGVjdGVkID0geyBsb2NhdGlvbnMsIGNhdGVnb3JpZXMgfTtcbiAgICBvbkNoYW5nZShuZXdUYWdzU2VsZWN0ZWQpO1xuICB9O1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZUNhdGVnb3J5ID0gKHZhbHVlOiBudW1iZXIpID0+IHtcbiAgICBjb25zdCB7IGxvY2F0aW9ucywgY2F0ZWdvcmllczogb3JpZ2luYWxDYXRlZ29yaWVzIH0gPSB0YWdzU2VsZWN0ZWQ7XG4gICAgY29uc3QgY2F0ZWdvcmllcyA9IG9yaWdpbmFsQ2F0ZWdvcmllcy5pbmNsdWRlcyh2YWx1ZSlcbiAgICAgID8gb3JpZ2luYWxDYXRlZ29yaWVzLmZpbHRlcihfaSA9PiBfaSAhPT0gdmFsdWUpXG4gICAgICA6IFsuLi5vcmlnaW5hbENhdGVnb3JpZXMsIHZhbHVlXTtcbiAgICBjb25zdCBuZXdUYWdzU2VsZWN0ZWQgPSB7IGxvY2F0aW9ucywgY2F0ZWdvcmllcyB9O1xuICAgIG9uQ2hhbmdlKG5ld1RhZ3NTZWxlY3RlZCk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNsYXNzTmFtZT17Y24oY2xzLndyYXBwZXIsIGNsYXNzTmFtZSl9PlxuICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5jaGFyaXR5X3RhZ3NfZmlsdGVyX2J1dHRvbn0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVUb2dnbGVQYW5lbH1cbiAgICAgICAgICBjbGFzc05hbWU9e2NuKGNscy5maWx0ZXJfYnV0dG9uLCBjbGFzc05hbWVCdG4pfVxuICAgICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgICAuLi5jb21iaW5lZFN0eWxlLFxuICAgICAgICAgICAgYmFja2dyb3VuZENvbG9yOiBmaWx0ZXJQYW5lbE9wZW5cbiAgICAgICAgICAgICAgPyBhY3RpdmVCdXR0b25Db2xvclxuICAgICAgICAgICAgICA6IGNvbWJpbmVkU3R5bGUuYmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIH19XG4gICAgICAgID5cbiAgICAgICAgICA8c3Bhbj57ZmlsdGVySWNvbn08L3NwYW4+XG4gICAgICAgICAge2J0blRleHRDb250ZW50fVxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAge2ZpbHRlclBhbmVsT3BlbiAmJiAoXG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPXtjbihjbHMuZmlsdGVyX2xheW91dCwgY2xhc3NOYW1lRmlsdGVyTGF5b3V0KX0+XG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5maWx0ZXJfbGF5b3V0X2JveH0+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfdGl0bGV9PkxvY2F0aW9uL3M8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPXtjbHMuZmlsdGVyX2xheW91dF9vcHRpb25zfT5cbiAgICAgICAgICAgICAge3N0YXRlcy5tYXAoKF9zdGF0ZSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBhY3RpdmUgPSB0YWdzU2VsZWN0ZWQubG9jYXRpb25zLmluY2x1ZGVzKFxuICAgICAgICAgICAgICAgICAgX3N0YXRlLnZhbHVlIGFzIGFueVxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgY29uc3QgbWF4U2VsZWN0ZWRSZWFjaGVkID0gbWF4U3RhdGVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgID8gdGFnc1NlbGVjdGVkLmxvY2F0aW9ucy5sZW5ndGggPj0gbWF4U3RhdGVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgIDogZmFsc2U7XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgPGRpdlxuICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2NuKFwic3RhdGVfaXRlbVwiLCB7IGFjdGl2ZTogYWN0aXZlIH0pfVxuICAgICAgICAgICAgICAgICAgICBrZXk9e2luZGV4fVxuICAgICAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgICAgICA8Q2hlY2tib3hcbiAgICAgICAgICAgICAgICAgICAgICBrZXk9e2luZGV4fVxuICAgICAgICAgICAgICAgICAgICAgIGxhYmVsPXtfc3RhdGUudmFsdWV9XG4gICAgICAgICAgICAgICAgICAgICAgb25DaGFuZ2U9eygpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgICAgIGhhbmRsZVRvZ2dsZVN0YXRlKF9zdGF0ZS52YWx1ZSBhcyBhbnkpO1xuICAgICAgICAgICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgICAgICAgICAgY2hlY2tlZD17YWN0aXZlfVxuICAgICAgICAgICAgICAgICAgICAgIGRpc2FibGVkPXttYXhTZWxlY3RlZFJlYWNoZWQgJiYgIWFjdGl2ZX1cbiAgICAgICAgICAgICAgICAgICAgICBjb2xvcj17Y2hlY2tCb3hTdHlsZX1cbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5maWx0ZXJfbGF5b3V0X2JveH0+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfdGl0bGV9PkNhdGVnb3J5PC9kaXY+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfb3B0aW9uc30+XG4gICAgICAgICAgICAgIHtjYXRlZ29yaWVzLm1hcCgoX2NhdGVnb3J5LCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgICAgIGNvbnN0IGFjdGl2ZSA9IHRhZ3NTZWxlY3RlZC5jYXRlZ29yaWVzLmluY2x1ZGVzKFxuICAgICAgICAgICAgICAgICAgX2NhdGVnb3J5LmlkIGFzIGFueVxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgY29uc3QgbWF4U2VsZWN0ZWRSZWFjaGVkID0gbWF4Q2F0ZWdvcmllc1NlbGVjdGVkXG4gICAgICAgICAgICAgICAgICA/IHRhZ3NTZWxlY3RlZC5jYXRlZ29yaWVzLmxlbmd0aCA+PSBtYXhDYXRlZ29yaWVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgIDogZmFsc2U7XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2NuKFwiY2F0ZWdvcnlfaXRlbVwiLCB7IGFjdGl2ZSB9KX0ga2V5PXtpbmRleH0+XG4gICAgICAgICAgICAgICAgICAgIDxDaGVja2JveFxuICAgICAgICAgICAgICAgICAgICAgIGtleT17aW5kZXh9XG4gICAgICAgICAgICAgICAgICAgICAgbGFiZWw9e19jYXRlZ29yeS5uYW1lfVxuICAgICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlPXsoKSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICBoYW5kbGVUb2dnbGVDYXRlZ29yeShfY2F0ZWdvcnkuaWQgYXMgYW55KTtcbiAgICAgICAgICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgICAgICAgICAgIGNoZWNrZWQ9e2FjdGl2ZX1cbiAgICAgICAgICAgICAgICAgICAgICBkaXNhYmxlZD17bWF4U2VsZWN0ZWRSZWFjaGVkICYmICFhY3RpdmV9XG4gICAgICAgICAgICAgICAgICAgICAgY29sb3I9e2NoZWNrQm94U3R5bGV9XG4gICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgICB9KX1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxCdXR0b25cbiAgICAgICAgICAgIGNvbG9yPXtjaGVja0JveFN0eWxlfVxuICAgICAgICAgICAgb25DbGljaz17KCkgPT4gc2V0RmlsdGVyUGFuZWxPcGVuKGZhbHNlKX1cbiAgICAgICAgICA+XG4gICAgICAgICAgICBDbG9zZVxuICAgICAgICAgIDwvQnV0dG9uPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICl9XG5cbiAgICAgIDxzdHlsZSBqc3g+e2BcbiAgICAgICAgLmFjdGl2ZSB7XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHthY3RpdmVDb2xvcn07XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogOHB4O1xuICAgICAgICB9XG4gICAgICAgIDpnbG9iYWwoLm1kYy1jaGVja2JveF9fbmF0aXZlLWNvbnRyb2w6ZW5hYmxlZDpjaGVja2VkXG4gICAgICAgICAgICB+IC5tZGMtY2hlY2tib3hfX2JhY2tncm91bmQpIHtcbiAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudCAhaW1wb3J0YW50O1xuICAgICAgICB9XG4gICAgICAgIDpnbG9iYWwoLm1kYy1jaGVja2JveF9fY2hlY2ttYXJrKSB7XG4gICAgICAgICAgY29sb3I6ICR7Y2hlY2tCb3hTdHlsZS5mb3JlZ3JvdW5kfTtcbiAgICAgICAgfVxuICAgICAgYH08L3N0eWxlPlxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b247XG4iXX0= */\n/*@ sourceURL=charity-tags-filter-button.tsx */")));
+};
+CharityTagsFilterButton.propTypes = {
+  btnIcon: _pt.node,
+  btnText: _pt.node,
+  states: _pt.any.isRequired,
+  categories: _pt.any.isRequired,
+  onChange: _pt.func.isRequired,
+  className: _pt.string,
+  classNameBtn: _pt.string,
+  buttonStyle: _pt.object,
+  activeButtonColor: _pt.string,
+  classNameFilterLayout: _pt.string,
+  checkBoxStyle: _pt.shape({
+    foreground: _pt.string.isRequired,
+    background: _pt.string.isRequired
+  }),
+  activeColor: _pt.string,
+  maxStatesSelected: _pt.number,
+  maxCategoriesSelected: _pt.number,
+  tagsSelected: _pt.shape({
+    locations: _pt.any.isRequired,
+    categories: _pt.any.isRequired
+  }).isRequired
+};
+
+export { Anchor, Avatar, BoldAnchor, Box, Button, ButtonSelect, CampaignCard, CampaignOfMonth, CharityCard, CharityTagsFilterButton, Checkbox, Chip, Chips, ComboField, ComboFieldExpander, CommentSection, CommentSectionV2, Cropper, CustomHeaderSingleDatePicker, DatePicker, DonateCard, DonationForm, DonationFormV2, Elevation, FavoriteCharityItem, FeaturedCampaignCard, FieldHelperText, FieldLabel, Flex, FooterV2, FundraisingSection, Grid, HeartToggle, HeroBnner as HeroBanner, HorizontalBar, Icon, IconButton, IconButtonGroup, Input, InputChips, InputSocial, List, Login, MENU_ANCHOR_CLASS, Menu, MenuList, ListDivider as MenuListDivider, MenuListItem, MenuListItemGraphic, ListItemMeta as MenuListItemMeta, MenuListItemText, MenuSurface, Modal, ModalImage, MyAccountChooseCharityCard, MyAccountFrpClosed, MyAccountFrpPreview, MyAccountSidebar, MyAccountStartFundraiseCard, MyAccountStatsDonated, MyAccountStatsRaised, MyCauseTheme, Navigation$1 as Nav, Navigation$2 as NavMyAccount, Navigation, PartnerChartStats, PartnerMonthlyDonations, PartnerMonthlyStats, PartnerMonthlyTable, PartnerToggleButton, PartnerToggleButtonBlock, PhoneInput, PhoneNumberInput, PhoneNumberInputV1, Popup, ProgressBar, Radio, RadioGroup, Select, SelectV2 as SelectEnhanced, SelectHelperText, SelectV2$1 as SelectV2, CustomSingleDatePicker as SingleDatePicker, Spinner, Stack, StartCampaignCard, Statistics, Switch, SwitchV2, Tabs, Text, TextField, HelperText as TextFieldHelperText, TextFieldSearch, ThemeContext, ThemeProvider, ThisMonthCard, Toast, TransactionCard, Uploader, getColorToken, parseNationalPhoneNumber, useTheme };

package/dist/index.js

@@ -29659,6 +29659,189 @@ InputSocial.propTypes = {
   icon: _pt.element
 };
 
+var cls$A = {"wrapper":"charity-tags-filter-button-module_wrapper__3DcoL","charity_tags_filter_button":"charity-tags-filter-button-module_charity_tags_filter_button__3Hgmd","filter_button":"charity-tags-filter-button-module_filter_button__JYmzm","filter_layout":"charity-tags-filter-button-module_filter_layout__1qFH5","filter_layout_title":"charity-tags-filter-button-module_filter_layout_title__cjG4v","filter_layout_options":"charity-tags-filter-button-module_filter_layout_options__3176V"};
+
+function FilterIcon(props) {
+  const {
+    color
+  } = props;
+  return /*#__PURE__*/React__default.createElement("svg", {
+    width: "25",
+    height: "24",
+    viewBox: "0 0 25 24",
+    fill: color || "#FFFFFF",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React__default.createElement("path", {
+    d: "M18.1538 19.6538C17.2169 19.6538 16.425 19.3303 15.778 18.6835C15.1312 18.0365 14.8077 17.2446 14.8077 16.3078C14.8077 15.3708 15.1312 14.5788 15.778 13.932C16.425 13.285 17.2169 12.9615 18.1538 12.9615C19.0908 12.9615 19.8827 13.285 20.5295 13.932C21.1765 14.5788 21.5 15.3708 21.5 16.3078C21.5 17.2446 21.1765 18.0365 20.5295 18.6835C19.8827 19.3303 19.0908 19.6538 18.1538 19.6538ZM18.1528 18.1538C18.6624 18.1538 19.0977 17.9737 19.4587 17.6135C19.8196 17.2532 20 16.8183 20 16.3088C20 15.7991 19.8198 15.3638 19.4595 15.0028C19.0993 14.6419 18.6644 14.4615 18.1547 14.4615C17.6451 14.4615 17.2098 14.6417 16.849 15.002C16.4882 15.3622 16.3077 15.7971 16.3077 16.3068C16.3077 16.8164 16.4878 17.2517 16.848 17.6125C17.2083 17.9733 17.6432 18.1538 18.1528 18.1538ZM5 17.0578V15.5578H12.6155V17.0578H5ZM6.84625 11.0385C5.90925 11.0385 5.11733 10.715 4.4705 10.068C3.8235 9.42117 3.5 8.62925 3.5 7.69225C3.5 6.75542 3.8235 5.9635 4.4705 5.3165C5.11733 4.66967 5.90925 4.34625 6.84625 4.34625C7.78308 4.34625 8.575 4.66967 9.222 5.3165C9.86883 5.9635 10.1923 6.75542 10.1923 7.69225C10.1923 8.62925 9.86883 9.42117 9.222 10.068C8.575 10.715 7.78308 11.0385 6.84625 11.0385ZM6.84525 9.5385C7.35492 9.5385 7.79017 9.35834 8.151 8.998C8.51183 8.63784 8.69225 8.20292 8.69225 7.69325C8.69225 7.18359 8.51217 6.74834 8.152 6.3875C7.79167 6.02667 7.35675 5.84625 6.84725 5.84625C6.33758 5.84625 5.90225 6.02634 5.54125 6.3865C5.18042 6.74684 5 7.18175 5 7.69125C5 8.20092 5.18017 8.63625 5.5405 8.99725C5.90067 9.35809 6.33558 9.5385 6.84525 9.5385ZM12.3845 8.44225V6.94225H20V8.44225H12.3845Z",
+    fill: color || "#FFFFFF"
+  }));
+}
+FilterIcon.propTypes = {
+  color: _pt.string
+};
+
+const CharityTagsFilterButton = _ref => {
+  let {
+    btnIcon,
+    btnText,
+    states,
+    categories,
+    onChange,
+    className,
+    classNameBtn,
+    buttonStyle,
+    activeButtonColor = "#E7684B",
+    classNameFilterLayout,
+    checkBoxStyle = {
+      foreground: "#FF7658",
+      background: "#FFFFFF"
+    },
+    activeColor = "#FDF9F1",
+    maxStatesSelected,
+    maxCategoriesSelected,
+    tagsSelected
+  } = _ref;
+  const filterIcon = btnIcon || /*#__PURE__*/React__default.createElement(FilterIcon, null);
+  const btnTextContent = btnText || "Filter";
+  const [filterPanelOpen, setFilterPanelOpen] = React.useState(false);
+  const defaultStyle = {
+    fontFamily: "Montserrat, sans-serif",
+    fontSize: "16px",
+    fontWeight: 600,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: "8px",
+    color: "#FFFFFF",
+    backgroundColor: "#FF7658",
+    cursor: "pointer",
+    border: "none",
+    padding: "18px 24px",
+    borderRadius: "8px",
+    transition: "background-color 0.3s"
+  };
+  const combinedStyle = _objectSpread2(_objectSpread2({}, defaultStyle), buttonStyle);
+  const handleTogglePanel = () => {
+    setFilterPanelOpen(!filterPanelOpen);
+  };
+  const handleToggleState = value => {
+    const {
+      locations: originalLocation,
+      categories
+    } = tagsSelected;
+    const locations = originalLocation.includes(value) ? originalLocation.filter(_i => _i !== value) : [...originalLocation, value];
+    const newTagsSelected = {
+      locations,
+      categories
+    };
+    onChange(newTagsSelected);
+  };
+  const handleToggleCategory = value => {
+    const {
+      locations,
+      categories: originalCategories
+    } = tagsSelected;
+    const categories = originalCategories.includes(value) ? originalCategories.filter(_i => _i !== value) : [...originalCategories, value];
+    const newTagsSelected = {
+      locations,
+      categories
+    };
+    onChange(newTagsSelected);
+  };
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.wrapper, className) || "")
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.charity_tags_filter_button )
+  }, /*#__PURE__*/React__default.createElement("div", {
+    onClick: handleTogglePanel,
+    style: _objectSpread2(_objectSpread2({}, combinedStyle), {}, {
+      backgroundColor: filterPanelOpen ? activeButtonColor : combinedStyle.backgroundColor
+    }),
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.filter_button, classNameBtn) || "")
+  }, /*#__PURE__*/React__default.createElement("span", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]])
+  }, filterIcon), btnTextContent)), filterPanelOpen && /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames(cls$A.filter_layout, classNameFilterLayout) || "")
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + ( "")
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_title )
+  }, "Location/s"), /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_options )
+  }, states.map((_state, index) => {
+    const active = tagsSelected.locations.includes(_state.value);
+    const maxSelectedReached = maxStatesSelected ? tagsSelected.locations.length >= maxStatesSelected : false;
+    return /*#__PURE__*/React__default.createElement("div", {
+      key: index,
+      className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames("state_item", {
+        active: active
+      }) || "")
+    }, /*#__PURE__*/React__default.createElement(Checkbox, {
+      key: index,
+      label: _state.value,
+      onChange: () => {
+        handleToggleState(_state.value);
+      },
+      checked: active,
+      disabled: maxSelectedReached && !active,
+      color: checkBoxStyle
+    }));
+  }))), /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + ( "")
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_title )
+  }, "Category"), /*#__PURE__*/React__default.createElement("div", {
+    className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (cls$A.filter_layout_options )
+  }, categories.map((_category, index) => {
+    const active = tagsSelected.categories.includes(_category.id);
+    const maxSelectedReached = maxCategoriesSelected ? tagsSelected.categories.length >= maxCategoriesSelected : false;
+    return /*#__PURE__*/React__default.createElement("div", {
+      key: index,
+      className: _JSXStyle.dynamic([["2734352145", [activeColor, checkBoxStyle.foreground]]]) + " " + (classnames("category_item", {
+        active
+      }) || "")
+    }, /*#__PURE__*/React__default.createElement(Checkbox, {
+      key: index,
+      label: _category.name,
+      onChange: () => {
+        handleToggleCategory(_category.id);
+      },
+      checked: active,
+      disabled: maxSelectedReached && !active,
+      color: checkBoxStyle
+    }));
+  }))), /*#__PURE__*/React__default.createElement(Button, {
+    color: checkBoxStyle,
+    onClick: () => setFilterPanelOpen(false)
+  }, "Close")), /*#__PURE__*/React__default.createElement(_JSXStyle, {
+    id: "2734352145",
+    dynamic: [activeColor, checkBoxStyle.foreground]
+  }, ".active.__jsx-style-dynamic-selector{background-color:".concat(activeColor, ";border-radius:8px;}.mdc-checkbox__native-control:enabled:checked ~ .mdc-checkbox__background{background-color:transparent !important;}.mdc-checkbox__checkmark{color:").concat(checkBoxStyle.foreground, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNoYXJpdHktdGFncy1maWx0ZXItYnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtTGtCLEFBR3lELEFBS04sQUFHTCxtQ0FDckMsS0FIQSxNQUxvQixrQkFDcEIiLCJmaWxlIjoiY2hhcml0eS10YWdzLWZpbHRlci1idXR0b24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgY24gZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBjbHMgZnJvbSBcIi4vY2hhcml0eS10YWdzLWZpbHRlci1idXR0b24ubW9kdWxlLnNjc3NcIjtcbmltcG9ydCBCdXR0b24gZnJvbSBcIi4uL2J1dHRvbi9idXR0b25cIjtcbmltcG9ydCBDaGVja2JveCBmcm9tIFwiLi4vY2hlY2tib3gvY2hlY2tib3hcIjtcbmltcG9ydCB7IEZpbHRlckljb24gfSBmcm9tIFwiLi9GaWx0ZXJJY29uXCI7XG5cbmV4cG9ydCB0eXBlIENoYXJpdHlUYWdzU2VsZWN0ZWQgPSB7XG4gIGxvY2F0aW9uczogQXJyYXk8c3RyaW5nPjtcbiAgY2F0ZWdvcmllczogQXJyYXk8bnVtYmVyPjtcbn07XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b25Qcm9wcyB7XG4gIGJ0bkljb24/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIGJ0blRleHQ/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIHN0YXRlczogQXJyYXk8eyB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyOyBsYWJlbDogc3RyaW5nIH0+O1xuICBjYXRlZ29yaWVzOiBBcnJheTx7IGlkOiBudW1iZXIgfCBzdHJpbmc7IG5hbWU6IHN0cmluZyB9PjtcbiAgb25DaGFuZ2U6ICh0YWdTZWxlY3RlZDogQ2hhcml0eVRhZ3NTZWxlY3RlZCkgPT4gdm9pZDtcbiAgY2xhc3NOYW1lPzogc3RyaW5nO1xuICBjbGFzc05hbWVCdG4/OiBzdHJpbmc7XG4gIGJ1dHRvblN0eWxlPzogb2JqZWN0O1xuICBhY3RpdmVCdXR0b25Db2xvcj86IHN0cmluZztcbiAgY2xhc3NOYW1lRmlsdGVyTGF5b3V0Pzogc3RyaW5nO1xuICBjaGVja0JveFN0eWxlPzogeyBmb3JlZ3JvdW5kOiBzdHJpbmc7IGJhY2tncm91bmQ6IHN0cmluZyB9O1xuICBhY3RpdmVDb2xvcj86IHN0cmluZztcbiAgbWF4U3RhdGVzU2VsZWN0ZWQ/OiBudW1iZXI7XG4gIG1heENhdGVnb3JpZXNTZWxlY3RlZD86IG51bWJlcjtcbiAgdGFnc1NlbGVjdGVkOiBDaGFyaXR5VGFnc1NlbGVjdGVkO1xufVxuXG5jb25zdCBDaGFyaXR5VGFnc0ZpbHRlckJ1dHRvbiA9ICh7XG4gIGJ0bkljb24sXG4gIGJ0blRleHQsXG4gIHN0YXRlcyxcbiAgY2F0ZWdvcmllcyxcbiAgb25DaGFuZ2UsXG4gIGNsYXNzTmFtZSxcbiAgY2xhc3NOYW1lQnRuLFxuICBidXR0b25TdHlsZSxcbiAgYWN0aXZlQnV0dG9uQ29sb3IgPSBcIiNFNzY4NEJcIixcbiAgY2xhc3NOYW1lRmlsdGVyTGF5b3V0LFxuICBjaGVja0JveFN0eWxlID0geyBmb3JlZ3JvdW5kOiBcIiNGRjc2NThcIiwgYmFja2dyb3VuZDogXCIjRkZGRkZGXCIgfSxcbiAgYWN0aXZlQ29sb3IgPSBcIiNGREY5RjFcIixcbiAgbWF4U3RhdGVzU2VsZWN0ZWQsXG4gIG1heENhdGVnb3JpZXNTZWxlY3RlZCxcbiAgdGFnc1NlbGVjdGVkLFxufTogQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b25Qcm9wcykgPT4ge1xuICBjb25zdCBmaWx0ZXJJY29uID0gYnRuSWNvbiB8fCA8RmlsdGVySWNvbiAvPjtcbiAgY29uc3QgYnRuVGV4dENvbnRlbnQgPSBidG5UZXh0IHx8IFwiRmlsdGVyXCI7XG4gIGNvbnN0IFtmaWx0ZXJQYW5lbE9wZW4sIHNldEZpbHRlclBhbmVsT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgZGVmYXVsdFN0eWxlID0ge1xuICAgIGZvbnRGYW1pbHk6IFwiTW9udHNlcnJhdCwgc2Fucy1zZXJpZlwiLFxuICAgIGZvbnRTaXplOiBcIjE2cHhcIixcbiAgICBmb250V2VpZ2h0OiA2MDAsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICBnYXA6IFwiOHB4XCIsXG4gICAgY29sb3I6IFwiI0ZGRkZGRlwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogXCIjRkY3NjU4XCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgIHBhZGRpbmc6IFwiMThweCAyNHB4XCIsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjhweFwiLFxuICAgIHRyYW5zaXRpb246IFwiYmFja2dyb3VuZC1jb2xvciAwLjNzXCIsXG4gIH07XG5cbiAgY29uc3QgY29tYmluZWRTdHlsZSA9IHsgLi4uZGVmYXVsdFN0eWxlLCAuLi5idXR0b25TdHlsZSB9O1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZVBhbmVsID0gKCkgPT4ge1xuICAgIHNldEZpbHRlclBhbmVsT3BlbighZmlsdGVyUGFuZWxPcGVuKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVUb2dnbGVTdGF0ZSA9ICh2YWx1ZTogc3RyaW5nKSA9PiB7XG4gICAgY29uc3QgeyBsb2NhdGlvbnM6IG9yaWdpbmFsTG9jYXRpb24sIGNhdGVnb3JpZXMgfSA9IHRhZ3NTZWxlY3RlZDtcbiAgICBjb25zdCBsb2NhdGlvbnMgPSBvcmlnaW5hbExvY2F0aW9uLmluY2x1ZGVzKHZhbHVlKVxuICAgICAgPyBvcmlnaW5hbExvY2F0aW9uLmZpbHRlcihfaSA9PiBfaSAhPT0gdmFsdWUpXG4gICAgICA6IFsuLi5vcmlnaW5hbExvY2F0aW9uLCB2YWx1ZV07XG4gICAgY29uc3QgbmV3VGFnc1NlbGVjdGVkID0geyBsb2NhdGlvbnMsIGNhdGVnb3JpZXMgfTtcbiAgICBvbkNoYW5nZShuZXdUYWdzU2VsZWN0ZWQpO1xuICB9O1xuXG4gIGNvbnN0IGhhbmRsZVRvZ2dsZUNhdGVnb3J5ID0gKHZhbHVlOiBudW1iZXIpID0+IHtcbiAgICBjb25zdCB7IGxvY2F0aW9ucywgY2F0ZWdvcmllczogb3JpZ2luYWxDYXRlZ29yaWVzIH0gPSB0YWdzU2VsZWN0ZWQ7XG4gICAgY29uc3QgY2F0ZWdvcmllcyA9IG9yaWdpbmFsQ2F0ZWdvcmllcy5pbmNsdWRlcyh2YWx1ZSlcbiAgICAgID8gb3JpZ2luYWxDYXRlZ29yaWVzLmZpbHRlcihfaSA9PiBfaSAhPT0gdmFsdWUpXG4gICAgICA6IFsuLi5vcmlnaW5hbENhdGVnb3JpZXMsIHZhbHVlXTtcbiAgICBjb25zdCBuZXdUYWdzU2VsZWN0ZWQgPSB7IGxvY2F0aW9ucywgY2F0ZWdvcmllcyB9O1xuICAgIG9uQ2hhbmdlKG5ld1RhZ3NTZWxlY3RlZCk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNsYXNzTmFtZT17Y24oY2xzLndyYXBwZXIsIGNsYXNzTmFtZSl9PlxuICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5jaGFyaXR5X3RhZ3NfZmlsdGVyX2J1dHRvbn0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBvbkNsaWNrPXtoYW5kbGVUb2dnbGVQYW5lbH1cbiAgICAgICAgICBjbGFzc05hbWU9e2NuKGNscy5maWx0ZXJfYnV0dG9uLCBjbGFzc05hbWVCdG4pfVxuICAgICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgICAuLi5jb21iaW5lZFN0eWxlLFxuICAgICAgICAgICAgYmFja2dyb3VuZENvbG9yOiBmaWx0ZXJQYW5lbE9wZW5cbiAgICAgICAgICAgICAgPyBhY3RpdmVCdXR0b25Db2xvclxuICAgICAgICAgICAgICA6IGNvbWJpbmVkU3R5bGUuYmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIH19XG4gICAgICAgID5cbiAgICAgICAgICA8c3Bhbj57ZmlsdGVySWNvbn08L3NwYW4+XG4gICAgICAgICAge2J0blRleHRDb250ZW50fVxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAge2ZpbHRlclBhbmVsT3BlbiAmJiAoXG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPXtjbihjbHMuZmlsdGVyX2xheW91dCwgY2xhc3NOYW1lRmlsdGVyTGF5b3V0KX0+XG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5maWx0ZXJfbGF5b3V0X2JveH0+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfdGl0bGV9PkxvY2F0aW9uL3M8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3NOYW1lPXtjbHMuZmlsdGVyX2xheW91dF9vcHRpb25zfT5cbiAgICAgICAgICAgICAge3N0YXRlcy5tYXAoKF9zdGF0ZSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBhY3RpdmUgPSB0YWdzU2VsZWN0ZWQubG9jYXRpb25zLmluY2x1ZGVzKFxuICAgICAgICAgICAgICAgICAgX3N0YXRlLnZhbHVlIGFzIGFueVxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgY29uc3QgbWF4U2VsZWN0ZWRSZWFjaGVkID0gbWF4U3RhdGVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgID8gdGFnc1NlbGVjdGVkLmxvY2F0aW9ucy5sZW5ndGggPj0gbWF4U3RhdGVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgIDogZmFsc2U7XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgPGRpdlxuICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2NuKFwic3RhdGVfaXRlbVwiLCB7IGFjdGl2ZTogYWN0aXZlIH0pfVxuICAgICAgICAgICAgICAgICAgICBrZXk9e2luZGV4fVxuICAgICAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgICAgICA8Q2hlY2tib3hcbiAgICAgICAgICAgICAgICAgICAgICBrZXk9e2luZGV4fVxuICAgICAgICAgICAgICAgICAgICAgIGxhYmVsPXtfc3RhdGUudmFsdWV9XG4gICAgICAgICAgICAgICAgICAgICAgb25DaGFuZ2U9eygpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgICAgIGhhbmRsZVRvZ2dsZVN0YXRlKF9zdGF0ZS52YWx1ZSBhcyBhbnkpO1xuICAgICAgICAgICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgICAgICAgICAgY2hlY2tlZD17YWN0aXZlfVxuICAgICAgICAgICAgICAgICAgICAgIGRpc2FibGVkPXttYXhTZWxlY3RlZFJlYWNoZWQgJiYgIWFjdGl2ZX1cbiAgICAgICAgICAgICAgICAgICAgICBjb2xvcj17Y2hlY2tCb3hTdHlsZX1cbiAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2Nscy5maWx0ZXJfbGF5b3V0X2JveH0+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfdGl0bGV9PkNhdGVnb3J5PC9kaXY+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT17Y2xzLmZpbHRlcl9sYXlvdXRfb3B0aW9uc30+XG4gICAgICAgICAgICAgIHtjYXRlZ29yaWVzLm1hcCgoX2NhdGVnb3J5LCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgICAgIGNvbnN0IGFjdGl2ZSA9IHRhZ3NTZWxlY3RlZC5jYXRlZ29yaWVzLmluY2x1ZGVzKFxuICAgICAgICAgICAgICAgICAgX2NhdGVnb3J5LmlkIGFzIGFueVxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgY29uc3QgbWF4U2VsZWN0ZWRSZWFjaGVkID0gbWF4Q2F0ZWdvcmllc1NlbGVjdGVkXG4gICAgICAgICAgICAgICAgICA/IHRhZ3NTZWxlY3RlZC5jYXRlZ29yaWVzLmxlbmd0aCA+PSBtYXhDYXRlZ29yaWVzU2VsZWN0ZWRcbiAgICAgICAgICAgICAgICAgIDogZmFsc2U7XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzc05hbWU9e2NuKFwiY2F0ZWdvcnlfaXRlbVwiLCB7IGFjdGl2ZSB9KX0ga2V5PXtpbmRleH0+XG4gICAgICAgICAgICAgICAgICAgIDxDaGVja2JveFxuICAgICAgICAgICAgICAgICAgICAgIGtleT17aW5kZXh9XG4gICAgICAgICAgICAgICAgICAgICAgbGFiZWw9e19jYXRlZ29yeS5uYW1lfVxuICAgICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlPXsoKSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICBoYW5kbGVUb2dnbGVDYXRlZ29yeShfY2F0ZWdvcnkuaWQgYXMgYW55KTtcbiAgICAgICAgICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgICAgICAgICAgIGNoZWNrZWQ9e2FjdGl2ZX1cbiAgICAgICAgICAgICAgICAgICAgICBkaXNhYmxlZD17bWF4U2VsZWN0ZWRSZWFjaGVkICYmICFhY3RpdmV9XG4gICAgICAgICAgICAgICAgICAgICAgY29sb3I9e2NoZWNrQm94U3R5bGV9XG4gICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgICB9KX1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxCdXR0b25cbiAgICAgICAgICAgIGNvbG9yPXtjaGVja0JveFN0eWxlfVxuICAgICAgICAgICAgb25DbGljaz17KCkgPT4gc2V0RmlsdGVyUGFuZWxPcGVuKGZhbHNlKX1cbiAgICAgICAgICA+XG4gICAgICAgICAgICBDbG9zZVxuICAgICAgICAgIDwvQnV0dG9uPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICl9XG5cbiAgICAgIDxzdHlsZSBqc3g+e2BcbiAgICAgICAgLmFjdGl2ZSB7XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHthY3RpdmVDb2xvcn07XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogOHB4O1xuICAgICAgICB9XG4gICAgICAgIDpnbG9iYWwoLm1kYy1jaGVja2JveF9fbmF0aXZlLWNvbnRyb2w6ZW5hYmxlZDpjaGVja2VkXG4gICAgICAgICAgICB+IC5tZGMtY2hlY2tib3hfX2JhY2tncm91bmQpIHtcbiAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudCAhaW1wb3J0YW50O1xuICAgICAgICB9XG4gICAgICAgIDpnbG9iYWwoLm1kYy1jaGVja2JveF9fY2hlY2ttYXJrKSB7XG4gICAgICAgICAgY29sb3I6ICR7Y2hlY2tCb3hTdHlsZS5mb3JlZ3JvdW5kfTtcbiAgICAgICAgfVxuICAgICAgYH08L3N0eWxlPlxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgQ2hhcml0eVRhZ3NGaWx0ZXJCdXR0b247XG4iXX0= */\n/*@ sourceURL=charity-tags-filter-button.tsx */")));
+};
+CharityTagsFilterButton.propTypes = {
+  btnIcon: _pt.node,
+  btnText: _pt.node,
+  states: _pt.any.isRequired,
+  categories: _pt.any.isRequired,
+  onChange: _pt.func.isRequired,
+  className: _pt.string,
+  classNameBtn: _pt.string,
+  buttonStyle: _pt.object,
+  activeButtonColor: _pt.string,
+  classNameFilterLayout: _pt.string,
+  checkBoxStyle: _pt.shape({
+    foreground: _pt.string.isRequired,
+    background: _pt.string.isRequired
+  }),
+  activeColor: _pt.string,
+  maxStatesSelected: _pt.number,
+  maxCategoriesSelected: _pt.number,
+  tagsSelected: _pt.shape({
+    locations: _pt.any.isRequired,
+    categories: _pt.any.isRequired
+  }).isRequired
+};
+
 exports._React = React__default;
 Object.defineProperty(exports, 'MenuCorner', {
   enumerable: true,
@@ -29675,6 +29858,7 @@ exports.ButtonSelect = ButtonSelect;
 exports.CampaignCard = CampaignCard;
 exports.CampaignOfMonth = CampaignOfMonth;
 exports.CharityCard = CharityCard;
+exports.CharityTagsFilterButton = CharityTagsFilterButton;
 exports.Checkbox = Checkbox;
 exports.Chip = Chip;
 exports.Chips = Chips;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mycause/ui",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "author": "Marc Porciuncula <marc@mycause.com.au>",
   "license": "MIT",
   "main": "dist/index.js",