@citygross/components 0.8.55 → 0.8.57

package/build/@types/components/ListItem/ListItem.d.ts

@@ -22,4 +22,4 @@ export declare type TListItem = {
     alignment?: EListItemAlignment;
     textColor?: string;
 };
-export declare function ListItem({ item, loading, isSmall, fallBackImage, imageAutoHeight, boldHeader, smallSkeleton, children, alignment, textColor, usedInSearch }: TListItem): JSX.Element;
+export declare const ListItem: ({ item, loading, isSmall, fallBackImage, imageAutoHeight, boldHeader, smallSkeleton, children, alignment, textColor, usedInSearch }: TListItem) => JSX.Element;

package/build/@types/components/SearchListItem/SearchListItem.d.ts

@@ -11,5 +11,6 @@ export declare type TSearchListItem = {
     price: React.ReactNode;
     item: TItem;
     markings?: TMarking[];
+    fallBackImage?: string;
 };
-export declare const SearchListItem: ({ item, button, loading, price, markings }: TSearchListItem) => JSX.Element;
+export declare const SearchListItem: ({ item, button, loading, price, markings, fallBackImage }: TSearchListItem) => JSX.Element;

package/build/cjs/components/src/components/ListItem/ListItem.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var typography = require('@citygross/typography');
 var Skeleton = require('react-loading-skeleton');
-var fallback_grocery = require('./assets/fallback_grocery.svg.js');
 var ListItem_styles = require('./ListItem.styles.js');
 var index = require('../../../../design-tokens/build/index.js');
 
@@ -19,26 +18,29 @@ exports.EListItemAlignment = void 0;
     EListItemAlignment["CENTER"] = "center";
     EListItemAlignment["TOP"] = "flex-start";
 })(exports.EListItemAlignment || (exports.EListItemAlignment = {}));
-function ListItem(_a) {
+var ListItem = function (_a) {
     var _b, _c;
     var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, _d = _a.alignment, alignment = _d === void 0 ? exports.EListItemAlignment.CENTER : _d, textColor = _a.textColor, usedInSearch = _a.usedInSearch;
     return (React__default["default"].createElement(ListItem_styles.ListItemContainer, null,
         React__default["default"].createElement(ListItem_styles.ListLeft, { usedInSearch: usedInSearch, alignment: alignment },
             React__default["default"].createElement(ListItem_styles.ListImageContainer, { isSmall: isSmall },
-                React__default["default"].createElement(ListItem_styles.ListImage, { autoHeight: imageAutoHeight, src: (item === null || item === void 0 ? void 0 : item.image) || fallBackImage || fallback_grocery, alt: item === null || item === void 0 ? void 0 : item.name, isSmall: isSmall, onError: function (e) {
-                        var target = e.target;
-                        target.onerror = null;
-                        target.src = fallBackImage || fallback_grocery;
+                React__default["default"].createElement(ListItem_styles.ListImage, { autoHeight: imageAutoHeight, src: item === null || item === void 0 ? void 0 : item.image, alt: item === null || item === void 0 ? void 0 : item.name, isSmall: isSmall, onError: function (e) {
+                        if (fallBackImage) {
+                            var target = e.target;
+                            if (!target.dataset.fallback) {
+                                target.dataset.fallback = 'true';
+                                target.onerror = null;
+                                target.src = fallBackImage;
+                            }
+                        }
                     } })),
             React__default["default"].createElement(ListItem_styles.ItemInformationContainer, { usedInSearch: usedInSearch, alignment: alignment },
-                React__default["default"].createElement(typography.BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', color: textColor || ((_b = index.theme.palette) === null || _b === void 0 ? void 0 : _b.darkest), size: isSmall
-                        ? typography.TextTypes.TextSize.EXTRASMALL
-                        : typography.TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 })),
+                React__default["default"].createElement(typography.BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', color: textColor || ((_b = index.theme.palette) === null || _b === void 0 ? void 0 : _b.darkest), size: isSmall ? typography.TextTypes.TextSize.EXTRASMALL : typography.TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 })),
                 loading ? (React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.SMALL },
                     React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 }))) : (item === null || item === void 0 ? void 0 : item.description) ? (React__default["default"].createElement(typography.BodyText, { size: isSmall ? typography.TextTypes.TextSize.TINY : typography.TextTypes.TextSize.SMALL, color: textColor || ((_c = index.theme.palette) === null || _c === void 0 ? void 0 : _c.dark) }, item === null || item === void 0 ? void 0 : item.description)) : null,
                 (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
         children && (React__default["default"].createElement(ListItem_styles.ListRight, { alignment: alignment }, children))));
-}
+};
 
 exports.ListItem = ListItem;
 //# sourceMappingURL=ListItem.js.map

package/build/cjs/components/src/components/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/SearchListItem/SearchListItem.js

@@ -11,13 +11,13 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var SearchListItem = function (_a) {
-    var item = _a.item, button = _a.button, loading = _a.loading, price = _a.price, markings = _a.markings;
+    var item = _a.item, button = _a.button, loading = _a.loading, price = _a.price, markings = _a.markings, fallBackImage = _a.fallBackImage;
     return (React__default["default"].createElement(SearchListItem_styles.SearchListItemWrapper, null,
         markings && (React__default["default"].createElement(SearchListItem_styles.MarkingWrapper, null, markings === null || markings === void 0 ? void 0 : markings.map(function (marking, index) { return (React__default["default"].createElement(SearchListItem_styles.Marking, { key: index },
             React__default["default"].createElement(SearchListItem_styles.ToolTip, { backgroundColor: marking === null || marking === void 0 ? void 0 : marking.backgroundColor, left: (index + 1) * 25 }, marking.tooltipText),
             marking.image)); }))),
         React__default["default"].createElement(SearchListItem_styles.ListItemWrapper, null,
-            React__default["default"].createElement(ListItem.ListItem, { usedInSearch: true, loading: loading, item: item })),
+            React__default["default"].createElement(ListItem.ListItem, { usedInSearch: true, loading: loading, item: item, fallBackImage: fallBackImage })),
         React__default["default"].createElement(SearchListItem_styles.PriceTagWrapper, null, price),
         React__default["default"].createElement(SearchListItem_styles.ButtonWrapper, null, button)));
 };

package/build/cjs/utils/build/index.js

@@ -68,6 +68,9 @@ var capitalizeFirstLetter = function (string) {
         return string.toUpperCase();
     }
 };
+var capitalizedAllWords = function (string) {
+    return string.replace(/(^\w|\s\w)/g, function (match) { return match.toUpperCase(); });
+};
 
 var languageCodeToCountryMap = {
     AD: 'Andorra',
@@ -18839,6 +18842,7 @@ function getDateInfo(dateStr) {
 }
 
 index.__exports.capitalizeFirstLetter = capitalizeFirstLetter;
+index.__exports.capitalizedAllWords = capitalizedAllWords;
 index.__exports.comparisonTypes = comparisonTypes;
 index.__exports.emailRegex = emailRegex;
 index.__exports.formatDateToLocale = formatDateToLocale;