krl-alfred 1.82.2 → 1.82.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components/Badges/layouts/text/text.styled.js +4 -0
  2. package/dist/components/BlogCard/BlogCard.styled.js +1 -1
  3. package/dist/components/ProductCardVertical/ProductCardVertical.js +2 -2
  4. package/dist/components/ProductCardVertical/ProductCardVertical.styled.js +1 -1
  5. package/dist/components/ProductCardVertical/props.js +1 -0
  6. package/dist/components/ProductCardVertical/stories/ProductCardVertical.stories.js +1 -0
  7. package/dist/i18n/locales/turkish.json +2 -1
  8. package/package.json +1 -1
package/dist/components/Badges/layouts/text/text.styled.js CHANGED
@@ -19,6 +19,8 @@ exports.TextStyled = styled_components_1.default.div(templateObject_1 || (templa
19
19
  return "var(--red)";
20
20
  case 'disabled':
21
21
  return "var(--dark-opacity-5)";
22
+ case 'light':
23
+ return "var(--dark-opacity-5)";
22
24
  default:
23
25
  return "var(--primary)";
24
26
  }
@@ -32,6 +34,8 @@ exports.TextStyled = styled_components_1.default.div(templateObject_1 || (templa
32
34
  return "white";
33
35
  case 'disabled':
34
36
  return "var(--dark-opacity-50)";
37
+ case 'light':
38
+ return "var(--dark)";
35
39
  default:
36
40
  return "white";
37
41
  }
package/dist/components/BlogCard/BlogCard.styled.js CHANGED
@@ -10,5 +10,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
10
10
  exports.BlogCardStyled = void 0;
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
12
  var devices_1 = require("../../constants/devices");
13
- exports.BlogCardStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$direction === "horizontal" ? "\n display: grid;\n align-items: center;\n justify-content: space-between;\n grid-template-columns: 104px 1fr;\n column-gap: 1.5rem;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "100%" : props.$size === "lg" ? "71.9%" : "58.2%"; }, function (props) { return props.$direction === "horizontal" ? "0" : "1.5rem"; }, function (props) { return props.$direction === "horizontal" ? "\n display: flex;\n flex-direction: column-reverse;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "0" : props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$size === "lg" ? "var(--headline-bold-18-22)" : "var(--title-bold-16-19)"; }, function (props) { return props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$direction === "horizontal" ? "3" : props.$size === "lg" ? "2" : "3"; }, function (props) { return props.$size === "lg" ? "22px" : "57px"; }, function (props) { return props.$size === "lg" ? "var(--title-regular-16-19)" : "var(--body-regular-14-17)"; }, function (props) { return props.$size === "lg" ? "5" : "3"; }, function (props) { return props.$direction === "horizontal" ? "\n display: none;\n " : ""; }, function (props) { return props.$size === "lg" ? "12px" : "0"; }, function (props) { return props.$size === "lg" ? "\n @media only screen and ".concat(devices_1.devices.lg, " {\n .content{\n display:block;\n .contentImg{\n padding-bottom: 58.2%;\n margin-bottom: 1.5rem;\n }\n .contentBottom{\n display:block;\n .tagWrapper{\n margin-bottom: 1rem;\n }\n .contentTitle {\n font: var(--title-bold-16-19);\n margin-bottom: 1rem;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: initial;\n }\n \n .contentDesc {\n display: block;\n font: var(--body-regular-14-17);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 0;\n }\n }\n }\n }\n ") : ""; });
13
+ exports.BlogCardStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$direction === "horizontal" ? "\n display: grid;\n align-items: center;\n justify-content: space-between;\n grid-template-columns: 104px 1fr;\n column-gap: 1.5rem;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "100%" : props.$size === "lg" ? "71.9%" : "58.2%"; }, function (props) { return props.$direction === "horizontal" ? "0" : "1.5rem"; }, function (props) { return props.$direction === "horizontal" ? "\n display: flex;\n flex-direction: column-reverse;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "0" : props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$size === "lg" ? "var(--headline-bold-18-22)" : "var(--title-bold-16-19)"; }, function (props) { return props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$direction === "horizontal" ? "3" : props.$size === "lg" ? "2" : "3"; }, function (props) { return props.$size === "lg" ? "22px" : "57px"; }, function (props) { return props.$size === "lg" ? "var(--title-regular-16-19)" : "var(--body-regular-14-17)"; }, function (props) { return props.$size === "lg" ? "5" : "3"; }, function (props) { return props.$direction === "horizontal" ? "\n display: none;\n " : ""; }, function (props) { return props.$size === "lg" ? "12px" : "0"; }, function (props) { return props.$size === "lg" ? "\n @media only screen and ".concat(devices_1.devices.lg, " {\n .content{\n display:block;\n .contentImg{\n padding-bottom: 58.2%;\n margin-bottom: 1.5rem;\n }\n .contentBottom{\n display:block;\n .tagWrapper{\n margin-bottom: 1rem;\n }\n .contentTitle {\n font: var(--title-bold-16-19);\n margin-bottom: 1rem;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: initial;\n }\n \n .contentDesc {\n display: block;\n font: var(--body-regular-14-17);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 0;\n }\n }\n }\n }\n ") : ""; });
14
14
  var templateObject_1;
package/dist/components/ProductCardVertical/ProductCardVertical.js CHANGED
@@ -32,8 +32,8 @@ var ProductCardVertical_styled_1 = require("./ProductCardVertical.styled");
32
32
  var react_i18next_1 = require("react-i18next");
33
33
  var Badges_1 = __importDefault(require("../Badges"));
34
34
  var ProductCardVertical = function (_a) {
35
- var _b = _a.title, title = _b === void 0 ? props_1.ProductCardVerticalDefault.title : _b, _c = _a.description, description = _c === void 0 ? props_1.ProductCardVerticalDefault.description : _c, _d = _a.hasDiscount, hasDiscount = _d === void 0 ? props_1.ProductCardVerticalDefault.hasDiscount : _d, _e = _a.price, price = _e === void 0 ? props_1.ProductCardVerticalDefault.price : _e, _f = _a.oldPrice, oldPrice = _f === void 0 ? props_1.ProductCardVerticalDefault.oldPrice : _f, _g = _a.oldPricePeriod, oldPricePeriod = _g === void 0 ? props_1.ProductCardVerticalDefault.oldPricePeriod : _g, _h = _a.slug, slug = _h === void 0 ? props_1.ProductCardVerticalDefault.slug : _h, _j = _a.period, period = _j === void 0 ? props_1.ProductCardVerticalDefault.period : _j, _k = _a.discountRate, discountRate = _k === void 0 ? props_1.ProductCardVerticalDefault.discountRate : _k, _l = _a.isResponsive, isResponsive = _l === void 0 ? props_1.ProductCardVerticalDefault.isResponsive : _l, _m = _a.image, image = _m === void 0 ? props_1.ProductCardVerticalDefault.image : _m, _o = _a.hasCustomBadge, hasCustomBadge = _o === void 0 ? props_1.ProductCardVerticalDefault.hasCustomBadge : _o, _p = _a.customBadge, customBadge = _p === void 0 ? props_1.ProductCardVerticalDefault.customBadge : _p, _q = _a.hasNewImageType, hasNewImageType = _q === void 0 ? props_1.ProductCardVerticalDefault.hasNewImageType : _q, other = __rest(_a, ["title", "description", "hasDiscount", "price", "oldPrice", "oldPricePeriod", "slug", "period", "discountRate", "isResponsive", "image", "hasCustomBadge", "customBadge", "hasNewImageType"]);
35
+ var _b = _a.title, title = _b === void 0 ? props_1.ProductCardVerticalDefault.title : _b, _c = _a.description, description = _c === void 0 ? props_1.ProductCardVerticalDefault.description : _c, _d = _a.hasDiscount, hasDiscount = _d === void 0 ? props_1.ProductCardVerticalDefault.hasDiscount : _d, _e = _a.price, price = _e === void 0 ? props_1.ProductCardVerticalDefault.price : _e, _f = _a.oldPrice, oldPrice = _f === void 0 ? props_1.ProductCardVerticalDefault.oldPrice : _f, _g = _a.oldPricePeriod, oldPricePeriod = _g === void 0 ? props_1.ProductCardVerticalDefault.oldPricePeriod : _g, _h = _a.slug, slug = _h === void 0 ? props_1.ProductCardVerticalDefault.slug : _h, _j = _a.period, period = _j === void 0 ? props_1.ProductCardVerticalDefault.period : _j, _k = _a.discountRate, discountRate = _k === void 0 ? props_1.ProductCardVerticalDefault.discountRate : _k, _l = _a.isResponsive, isResponsive = _l === void 0 ? props_1.ProductCardVerticalDefault.isResponsive : _l, _m = _a.image, image = _m === void 0 ? props_1.ProductCardVerticalDefault.image : _m, _o = _a.hasCustomBadge, hasCustomBadge = _o === void 0 ? props_1.ProductCardVerticalDefault.hasCustomBadge : _o, _p = _a.customBadge, customBadge = _p === void 0 ? props_1.ProductCardVerticalDefault.customBadge : _p, _q = _a.hasNewImageType, hasNewImageType = _q === void 0 ? props_1.ProductCardVerticalDefault.hasNewImageType : _q, _r = _a.hasOutOfStock, hasOutOfStock = _r === void 0 ? props_1.ProductCardVerticalDefault.hasOutOfStock : _r, other = __rest(_a, ["title", "description", "hasDiscount", "price", "oldPrice", "oldPricePeriod", "slug", "period", "discountRate", "isResponsive", "image", "hasCustomBadge", "customBadge", "hasNewImageType", "hasOutOfStock"]);
36
36
  var t = (0, react_i18next_1.useTranslation)().t;
37
- return ((0, jsx_runtime_1.jsx)(ProductCardVertical_styled_1.ProductCardVerticalStyled, __assign({ "$isResponsive": isResponsive, "$discountRate": discountRate, "$hasNewImageType": hasNewImageType }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [hasDiscount && !hasCustomBadge && (0, jsx_runtime_1.jsx)("div", __assign({ className: "cartBadge" }, { children: (0, jsx_runtime_1.jsx)(Badges_1.default, { size: "medium", left: (isResponsive ? '16px' : '8px'), top: (isResponsive ? '16px' : '8px'), title: t("discount") }) })), hasCustomBadge && (0, jsx_runtime_1.jsx)("div", __assign({ className: "cartBadge hasInset" }, { children: customBadge })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "img" }, { children: image })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "productCardContent" }, { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "productCardTitle" }, { children: title })), (0, jsx_runtime_1.jsx)("p", __assign({ className: "productCardDescription" }, { children: description })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "productCardPriceContent" }, { children: [discountRate > 0 && (0, jsx_runtime_1.jsxs)("div", __assign({ className: "discountRate" }, { children: ["%", discountRate] })), (0, jsx_runtime_1.jsxs)("div", { children: [oldPrice && discountRate > 0 && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "oldPrice" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "price" }, { children: oldPrice })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "period" }, { children: "/".concat(oldPricePeriod) }))] }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "newPrice" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "price" }, { children: price })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "period" }, { children: "/".concat(period) }))] }))] })] }))] }))] }) })));
37
+ return ((0, jsx_runtime_1.jsx)(ProductCardVertical_styled_1.ProductCardVerticalStyled, __assign({ "$isResponsive": isResponsive, "$discountRate": discountRate, "$hasNewImageType": hasNewImageType, "$hasOutOfStock": hasOutOfStock }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [hasDiscount && !hasCustomBadge && (0, jsx_runtime_1.jsx)("div", __assign({ className: "cartBadge" }, { children: (0, jsx_runtime_1.jsx)(Badges_1.default, { size: "medium", left: (isResponsive ? '16px' : '8px'), top: (isResponsive ? '16px' : '8px'), title: t("discount") }) })), hasCustomBadge && (0, jsx_runtime_1.jsx)("div", __assign({ className: "cartBadge hasInset" }, { children: customBadge })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "img" }, { children: [image, hasOutOfStock && (0, jsx_runtime_1.jsx)("div", __assign({ className: "outOfStock" }, { children: (0, jsx_runtime_1.jsx)(Badges_1.default, { layout: "text", variant: "light", title: t("ALL_RENTED") }) }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "productCardContent" }, { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "productCardTitle" }, { children: title })), (0, jsx_runtime_1.jsx)("p", __assign({ className: "productCardDescription" }, { children: description })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "productCardPriceContent" }, { children: [discountRate > 0 && (0, jsx_runtime_1.jsxs)("div", __assign({ className: "discountRate" }, { children: ["%", discountRate] })), (0, jsx_runtime_1.jsxs)("div", { children: [oldPrice && discountRate > 0 && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "oldPrice" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "price" }, { children: oldPrice })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "period" }, { children: "/".concat(oldPricePeriod) }))] }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "newPrice" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "price" }, { children: price })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "period" }, { children: "/".concat(period) }))] }))] })] }))] }))] }) })));
38
38
  };
39
39
  exports.default = (0, react_1.memo)(ProductCardVertical);
package/dist/components/ProductCardVertical/ProductCardVertical.styled.js CHANGED
@@ -10,5 +10,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
10
10
  exports.ProductCardVerticalStyled = void 0;
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
12
  var devices_1 = require("../../constants/devices");
13
- exports.ProductCardVerticalStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n\n .cartBadge {\n position: absolute;\n left: 8px;\n top: 8px;\n z-index: 2;\n\n &:is(.hasInset) {\n left: 7px;\n top: 0;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n &:hover {\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n\n .img {\n border-radius: 0.5rem;\n border: 1px solid var(--dark-opacity-5);\n background: #FFF;\n position: relative;\n overflow: hidden;\n height: 150px;\n box-sizing: border-box;\n z-index: 1;\n text-align: center;\n padding: 0.5rem;\n ", "\n }\n\n .productCardContent {\n padding: 1rem 0 0.5rem 0;\n\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 38px;\n word-break: break-word;\n font: var(--title-bold-16-19);\n }\n\n .productCardDescription {\n display: block;\n margin-top: 0.5rem;\n color: var(--grey-40);\n margin-bottom: 1.5rem;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 34px;\n word-break: break-word;\n font: var(--body-medium-14-17);\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\n height: 36px;\n grid-template-columns: ", ";\n\n .discountRate {\n margin-right: 0.5rem;\n width: 48px;\n height: 36px;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n color: var(--primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font: var(--body-extra-bold-13-16);\n }\n\n .oldPrice, .newPrice {\n display: flex;\n align-items: end;\n justify-content: flex-start;\n\n .price {\n margin-right: 4px;\n }\n }\n\n .oldPrice {\n color: var(--dark-opacity-25);\n margin-bottom: 2px;\n\n .price, .period {\n text-decoration: line-through;\n }\n\n .price {\n font: var(--caption-semi-bold-12-15);\n }\n\n .period {\n font: var(--caption-regular-12-15);\n }\n }\n\n .newPrice {\n .price {\n font: var(--body-extra-bold-14-17);\n }\n\n .period {\n font: var(--body-regular-13-16);\n }\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n\n .cartBadge {\n position: absolute;\n left: 8px;\n top: 8px;\n z-index: 2;\n\n &:is(.hasInset) {\n left: 7px;\n top: 0;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n &:hover {\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n\n .img {\n border-radius: 0.5rem;\n border: 1px solid var(--dark-opacity-5);\n background: #FFF;\n position: relative;\n overflow: hidden;\n height: 150px;\n box-sizing: border-box;\n z-index: 1;\n text-align: center;\n padding: 0.5rem;\n ", "\n }\n\n .productCardContent {\n padding: 1rem 0 0.5rem 0;\n\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 38px;\n word-break: break-word;\n font: var(--title-bold-16-19);\n }\n\n .productCardDescription {\n display: block;\n margin-top: 0.5rem;\n color: var(--grey-40);\n margin-bottom: 1.5rem;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 34px;\n word-break: break-word;\n font: var(--body-medium-14-17);\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\n height: 36px;\n grid-template-columns: ", ";\n\n .discountRate {\n margin-right: 0.5rem;\n width: 48px;\n height: 36px;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n color: var(--primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font: var(--body-extra-bold-13-16);\n }\n\n .oldPrice, .newPrice {\n display: flex;\n align-items: end;\n justify-content: flex-start;\n\n .price {\n margin-right: 4px;\n }\n }\n\n .oldPrice {\n color: var(--dark-opacity-25);\n margin-bottom: 2px;\n\n .price, .period {\n text-decoration: line-through;\n }\n\n .price {\n font: var(--caption-semi-bold-12-15);\n }\n\n .period {\n font: var(--caption-regular-12-15);\n }\n }\n\n .newPrice {\n .price {\n font: var(--body-extra-bold-14-17);\n }\n\n .period {\n font: var(--body-regular-13-16);\n }\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$hasNewImageType ? "\n *{\n height: 100% !important;\n object-fit: contain;\n max-width: 100%;\n }\n " : "\n > * {\n width: 100%;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n }\n *{ \n height: calc(100% - 0.5rem) !important;\n aspect-ratio: 1 / 1 !important;\n }\n "; }, function (props) { return props.$discountRate ? 'center' : 'end'; }, function (props) { return props.$discountRate ? 'auto 1fr' : '1fr'; }, function (props) { return props.$isResponsive && "\n @media only screen and ".concat(devices_1.devices.sm, " {\n padding: 1.5rem;\n .cartBadge{\n left: 16px;\n top: 16px;\n &:is(.hasInset){\n left: 15px;\n top: 8px;\n }\n }\n .img {\n height: 215px;\n }\n .productCardContent{\n padding: 1.5rem 0 0.5rem 0;\n .productCardTitle{\n height: 44px;\n font: var(--headline-bold-18-22);\n }\n .productCardDescription{\n margin-bottom: 1.5rem;\n height: 37px;\n font: var(--title-medium-16-19);\n }\n .productCardPriceContent{\n height: 48px;\n .discountRate{\n width: 65px;\n height: 48px;\n font: var(--title-extra-bold-16-19);\n }\n \n .oldPrice {\n .price{\n font: var(--body-semi-bold-13-16);\n }\n }\n .newPrice {\n .price{\n font: var(--title-extra-bold-16-19);\n }\n .period{\n font: var(--body-regular-14-17);\n }\n }\n }\n }\n }\n "); });
13
+ exports.ProductCardVerticalStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n\n .cartBadge {\n position: absolute;\n left: 8px;\n top: 8px;\n z-index: 2;\n\n &:is(.hasInset) {\n left: 7px;\n top: 0;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n &:hover {\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n\n .img {\n border-radius: 0.5rem;\n border: 1px solid var(--dark-opacity-5);\n background: #FFF;\n position: relative;\n overflow: hidden;\n height: 150px;\n box-sizing: border-box;\n z-index: 1;\n text-align: center;\n padding: 0.5rem;\n ", "\n .outOfStock{\n width: 100% !important;\n height: 100% !important;\n background-color: #BABBC280;\n > div{\n height: 17px !important;\n aspect-ratio: initial !important;\n }\n }\n }\n\n .productCardContent {\n padding: 1rem 0 0.5rem 0;\n\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 38px;\n word-break: break-word;\n font: var(--title-bold-16-19);\n }\n\n .productCardDescription {\n display: block;\n margin-top: 0.5rem;\n color: var(--grey-40);\n margin-bottom: 1.5rem;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 34px;\n word-break: break-word;\n font: var(--body-medium-14-17);\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\n height: 36px;\n grid-template-columns: ", ";\n\n .discountRate {\n margin-right: 0.5rem;\n width: 48px;\n height: 36px;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n color: var(--primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font: var(--body-extra-bold-13-16);\n }\n\n .oldPrice, .newPrice {\n display: flex;\n align-items: end;\n justify-content: flex-start;\n\n .price {\n margin-right: 4px;\n }\n }\n\n .oldPrice {\n color: var(--dark-opacity-25);\n margin-bottom: 2px;\n\n .price, .period {\n text-decoration: line-through;\n }\n\n .price {\n font: var(--caption-semi-bold-12-15);\n }\n\n .period {\n font: var(--caption-regular-12-15);\n }\n }\n\n .newPrice {\n .price {\n font: var(--body-extra-bold-14-17);\n }\n\n .period {\n font: var(--body-regular-13-16);\n }\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n\n .cartBadge {\n position: absolute;\n left: 8px;\n top: 8px;\n z-index: 2;\n\n &:is(.hasInset) {\n left: 7px;\n top: 0;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n &:hover {\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n\n .img {\n border-radius: 0.5rem;\n border: 1px solid var(--dark-opacity-5);\n background: #FFF;\n position: relative;\n overflow: hidden;\n height: 150px;\n box-sizing: border-box;\n z-index: 1;\n text-align: center;\n padding: 0.5rem;\n ", "\n .outOfStock{\n width: 100% !important;\n height: 100% !important;\n background-color: #BABBC280;\n > div{\n height: 17px !important;\n aspect-ratio: initial !important;\n }\n }\n }\n\n .productCardContent {\n padding: 1rem 0 0.5rem 0;\n\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 38px;\n word-break: break-word;\n font: var(--title-bold-16-19);\n }\n\n .productCardDescription {\n display: block;\n margin-top: 0.5rem;\n color: var(--grey-40);\n margin-bottom: 1.5rem;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 34px;\n word-break: break-word;\n font: var(--body-medium-14-17);\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\n height: 36px;\n grid-template-columns: ", ";\n\n .discountRate {\n margin-right: 0.5rem;\n width: 48px;\n height: 36px;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n color: var(--primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font: var(--body-extra-bold-13-16);\n }\n\n .oldPrice, .newPrice {\n display: flex;\n align-items: end;\n justify-content: flex-start;\n\n .price {\n margin-right: 4px;\n }\n }\n\n .oldPrice {\n color: var(--dark-opacity-25);\n margin-bottom: 2px;\n\n .price, .period {\n text-decoration: line-through;\n }\n\n .price {\n font: var(--caption-semi-bold-12-15);\n }\n\n .period {\n font: var(--caption-regular-12-15);\n }\n }\n\n .newPrice {\n .price {\n font: var(--body-extra-bold-14-17);\n }\n\n .period {\n font: var(--body-regular-13-16);\n }\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$hasNewImageType ? "\n *{\n height: 100% !important;\n object-fit: contain;\n max-width: 100%;\n }\n " : "\n > * {\n width: 100%;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n }\n *{ \n height: calc(100% - 0.5rem) !important;\n aspect-ratio: 1 / 1 !important;\n }\n "; }, function (props) { return props.$discountRate ? 'center' : 'end'; }, function (props) { return props.$discountRate ? 'auto 1fr' : '1fr'; }, function (props) { return props.$isResponsive && "\n @media only screen and ".concat(devices_1.devices.sm, " {\n padding: 1.5rem;\n .cartBadge{\n left: 16px;\n top: 16px;\n &:is(.hasInset){\n left: 15px;\n top: 8px;\n }\n }\n .img {\n height: 215px;\n }\n .productCardContent{\n padding: 1.5rem 0 0.5rem 0;\n .productCardTitle{\n height: 44px;\n font: var(--headline-bold-18-22);\n }\n .productCardDescription{\n margin-bottom: 1.5rem;\n height: 37px;\n font: var(--title-medium-16-19);\n }\n .productCardPriceContent{\n height: 48px;\n .discountRate{\n width: 65px;\n height: 48px;\n font: var(--title-extra-bold-16-19);\n }\n \n .oldPrice {\n .price{\n font: var(--body-semi-bold-13-16);\n }\n }\n .newPrice {\n .price{\n font: var(--title-extra-bold-16-19);\n }\n .period{\n font: var(--body-regular-14-17);\n }\n }\n }\n }\n }\n "); });
14
14
  var templateObject_1;
package/dist/components/ProductCardVertical/props.js CHANGED
@@ -16,4 +16,5 @@ exports.ProductCardVerticalDefault = {
16
16
  hasCustomBadge: false,
17
17
  customBadge: null,
18
18
  hasNewImageType: false,
19
+ hasOutOfStock: false
19
20
  };
package/dist/components/ProductCardVertical/stories/ProductCardVertical.stories.js CHANGED
@@ -40,5 +40,6 @@ exports.Default = {
40
40
  image: (0, jsx_runtime_1.jsx)("img", { src: "https://kiralarsin.s3.eu-central-1.amazonaws.com/products/4MOMSMAMAROOANAKUC_1.jpg", alt: "test" }),
41
41
  hasCustomBadge: false,
42
42
  isResponsive: false,
43
+ hasOutOfStock: false,
43
44
  },
44
45
  };
package/dist/i18n/locales/turkish.json CHANGED
@@ -14,5 +14,6 @@
14
14
  "SEARCH": "Arama yap",
15
15
  "NO_OPTIONS_FOUND": "Sonuç bulunamadı",
16
16
  "GO": "Git",
17
- "OPTIONAL": "Opsiyonel"
17
+ "OPTIONAL": "Opsiyonel",
18
+ "ALL_RENTED": "Hepsi kiralandı"
18
19
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "krl-alfred",
3
- "version": "1.82.2",
3
+ "version": "1.82.4",
4
4
  "files": [
5
5
  "dist"
6
6
  ],