krl-alfred 1.76.36 → 1.76.37

package/dist/components/Button/Button.js

@@ -27,7 +27,7 @@ var Children = function (props) {
 };
 var Button = (0, react_1.forwardRef)(function (props, ref) {
     var type = props.type, isLoading = props.isLoading, onClick = props.onClick, disabled = props.disabled, size = props.size, variant = props.variant, width = props.width, icon = props.icon, children = props.children, iconStrokeWidth = props.iconStrokeWidth;
-    return ((0, jsx_runtime_1.jsx)(Button_styled_1.ButtonStyled, __assign({ className: (0, classnames_1.default)({ "loading": isLoading }), onClick: onClick, disabled: disabled || isLoading, size: size, variant: variant, width: width, icon: icon, type: type, ref: ref }, { children: (0, jsx_runtime_1.jsxs)(Children, __assign({ isLoading: isLoading, iconStrokeWidth: iconStrokeWidth, icon: icon }, { children: [isLoading && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "loadingContent" }, { children: (0, jsx_runtime_1.jsx)(Loader_1.default, { width: size === "big" ? "24px" : "16px", height: size === "big" ? "24px" : "16px", variant: variant === 'primary' ? 'secondary' : 'primary' }) }))), children] })) })));
+    return ((0, jsx_runtime_1.jsx)(Button_styled_1.ButtonStyled, __assign({ className: (0, classnames_1.default)({ "loading": isLoading }), onClick: onClick, disabled: disabled || isLoading, "$size": size, "$variant": variant, "$width": width, "$icon": icon, type: type, ref: ref }, { children: (0, jsx_runtime_1.jsxs)(Children, __assign({ isLoading: isLoading, iconStrokeWidth: iconStrokeWidth, icon: icon }, { children: [isLoading && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "loadingContent" }, { children: (0, jsx_runtime_1.jsx)(Loader_1.default, { width: size === "big" ? "24px" : "16px", height: size === "big" ? "24px" : "16px", variant: variant === 'primary' ? 'secondary' : 'primary' }) }))), children] })) })));
 });
 Button.propTypes = {
     iconStrokeWidth: prop_types_1.default.string,

package/dist/components/Button/Button.styled.js

@@ -31,7 +31,7 @@ exports.IconStyled = exports.ButtonStyled = void 0;
 var styled_components_1 = __importStar(require("styled-components"));
 var devices_1 = require("../../constants/devices");
 var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: var(--primary);\n  color: white;\n  border: 1px solid transparent;\n  font: ", ";\n  \n  @media only screen and ", " {\n    &:hover {\n      background-color: var(--primary-hover);\n    }\n  }\n \n\n  &:active {\n    background-color: var(--primary-press);\n    @media only screen and ", " {\n      background-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: var(--primary);\n  color: white;\n  border: 1px solid transparent;\n  font: ", ";\n  \n  @media only screen and ", " {\n    &:hover {\n      background-color: var(--primary-hover);\n    }\n  }\n \n\n  &:active {\n    background-color: var(--primary-press);\n    @media only screen and ", " {\n      background-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
-    switch (props.size) {
+    switch (props.$size) {
         case 'xsmall':
             return "var(--caption-bold-12-15)";
         case 'small':
@@ -45,7 +45,7 @@ var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
 var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n\n \n\n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n\n \n\n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
-    switch (props.size) {
+    switch (props.$size) {
         case 'xsmall':
             return "var(--caption-bold-12-15)";
         case 'small':
@@ -59,7 +59,7 @@ var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
 var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary);\n  border: 1px solid;\n  border-color: var(--primary);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary);\n  border: 1px solid;\n  border-color: var(--primary);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"])), function (props) {
-    switch (props.size) {
+    switch (props.$size) {
         case 'xsmall':
             return "var(--caption-bold-12-15)";
         case 'small':
@@ -73,7 +73,7 @@ var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
 var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary);\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
-    switch (props.size) {
+    switch (props.$size) {
         case 'xsmall':
             return "var(--body-bold-13-16)";
         case 'small':
@@ -86,8 +86,8 @@ var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 =
             return "var(--body-bold-14-17)";
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
-exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n  }\n"], ["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n  }\n"])), function (props) { return props.size === 'xsmall' ? '4px' : '8px'; }, function (props) { return props.width ? '0' : '0 24px'; }, function (props) { return props.width; }, function (props) {
-    switch (props.variant) {
+exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n  }\n"], ["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n  }\n"])), function (props) { return props.$size === 'xsmall' ? '4px' : '8px'; }, function (props) { return props.$width ? '0' : '0 24px'; }, function (props) { return props.$width; }, function (props) {
+    switch (props.$variant) {
         case 'primary':
             return primary;
         case 'secondary':
@@ -100,7 +100,7 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (t
             return primary;
     }
 }, function (props) {
-    switch (props.size) {
+    switch (props.$size) {
         case 'big':
             return "56px;";
         case 'medium':
@@ -112,6 +112,6 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (t
         default:
             return "48px";
     }
-}, function (props) { return props.icon ? "10px" : "0"; });
+}, function (props) { return props.$icon ? "10px" : "0"; });
 exports.IconStyled = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/Icon/Icon.js

@@ -16,7 +16,7 @@ var index_1 = require("./index");
 var Icon_styled_1 = require("./Icon.styled");
 var Icon = function (props) {
     var width = props.width, height = props.height, hasWrapper = props.hasWrapper, strokeWidth = props.strokeWidth, color = props.color;
-    return hasWrapper ? ((0, jsx_runtime_1.jsx)(Icon_styled_1.IconWrapper, __assign({ width: width, height: height, strokeWidth: strokeWidth, color: color }, { children: index_1.iconList[props.name]({}) || (0, jsx_runtime_1.jsx)("div", {}) }))) : (index_1.iconList[props.name]({ width: width, height: height, color: color }) || (0, jsx_runtime_1.jsx)("div", {}));
+    return hasWrapper ? ((0, jsx_runtime_1.jsx)(Icon_styled_1.IconWrapper, __assign({ "$width": width, "$height": height, "$strokeWidth": strokeWidth, "$color": color }, { children: index_1.iconList[props.name]({}) || (0, jsx_runtime_1.jsx)("div", {}) }))) : (index_1.iconList[props.name]({ width: width, height: height, color: color }) || (0, jsx_runtime_1.jsx)("div", {}));
 };
 Icon.defaultProps = {
     hasWrapper: true

package/dist/components/Icon/Icon.styled.js

@@ -10,5 +10,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IconWrapper = exports.IconStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
 exports.IconStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr) ) ;\n  gap: 50px 20px;\n  .item{\n    text-align: center;\n    .title{\n      display: block;\n      margin-top: 10px;\n      font:var(--body-regular-14-17);\n    }\n  }\n"], ["\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr) ) ;\n  gap: 50px 20px;\n  .item{\n    text-align: center;\n    .title{\n      display: block;\n      margin-top: 10px;\n      font:var(--body-regular-14-17);\n    }\n  }\n"])));
-exports.IconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    display: inline-block;\n    vertical-align: middle;\n    svg{\n        display: block;\n        width: ", ";\n        height: ", ";\n        path,circle,rect{\n            color: ", ";\n            &[stroke-width]{\n                stroke-width: ", ";\n            }\n        }\n    }\n"], ["\n    display: inline-block;\n    vertical-align: middle;\n    svg{\n        display: block;\n        width: ", ";\n        height: ", ";\n        path,circle,rect{\n            color: ", ";\n            &[stroke-width]{\n                stroke-width: ", ";\n            }\n        }\n    }\n"])), function (props) { return props.width; }, function (props) { return props.height; }, function (props) { return props.color; }, function (props) { return props.strokeWidth; });
+exports.IconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    display: inline-block;\n    vertical-align: middle;\n    svg{\n        display: block;\n        width: ", ";\n        height: ", ";\n        path,circle,rect{\n            color: ", ";\n            &[stroke-width]{\n                stroke-width: ", ";\n            }\n        }\n    }\n"], ["\n    display: inline-block;\n    vertical-align: middle;\n    svg{\n        display: block;\n        width: ", ";\n        height: ", ";\n        path,circle,rect{\n            color: ", ";\n            &[stroke-width]{\n                stroke-width: ", ";\n            }\n        }\n    }\n"])), function (props) { return props.$width; }, function (props) { return props.$height; }, function (props) { return props.$color; }, function (props) { return props.$strokeWidth; });
 var templateObject_1, templateObject_2;

package/dist/components/Icon/InstagramNegativeFilled.js

@@ -0,0 +1,40 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var React = __importStar(require("react"));
+var SvgInstagramNegativeFilled = function (props) { return ((0, jsx_runtime_1.jsxs)("svg", __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.7422 21.0001H7.25778C4.90569 21.0001 3 18.5554 3 15.5395V8.46061C3 5.44476 4.90569 3 7.25778 3H16.7422C19.0943 3 21 5.44476 21 8.46061V15.5395C21 18.5554 19.0943 21.0001 16.7422 21.0001Z", fill: "currentColor", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { d: "M16.5391 6.80998L16.5391 6.80998L16.54 6.80809C16.571 6.73753 16.5999 6.69019 16.6574 6.63231C16.7068 6.59037 16.7521 6.56032 16.8148 6.53179C17.0023 6.46148 17.2237 6.51197 17.3509 6.63904L17.3508 6.63905L17.3534 6.64159C17.3735 6.66141 17.3933 6.68464 17.4103 6.70808C17.4226 6.72525 17.4311 6.73924 17.4363 6.74866L17.451 6.78639L17.4553 6.79735L17.46 6.80809C17.486 6.86646 17.5 6.9321 17.5 7.00049C17.5 7.1214 17.4561 7.24191 17.3489 7.3579C17.2703 7.43497 17.1689 7.48336 17.06 7.49642L17.0002 7.49938L16.9431 7.4965C16.9057 7.49171 16.8609 7.48087 16.7988 7.45647C16.7373 7.42836 16.6906 7.39706 16.6427 7.34923C16.5483 7.24686 16.5 7.12056 16.5 7.00049C16.5 6.93155 16.5142 6.86598 16.5391 6.80998ZM16.0823 6.60681C16.1368 6.48285 16.2014 6.37829 16.3182 6.26456L16.0823 6.60681Z", stroke: "#FAF7FF" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.0001 12.182C8.9991 13.935 10.4301 15.369 12.1801 15.368C13.9271 15.366 15.3541 13.938 15.3571 12.189C15.3601 10.433 13.9341 9.002 12.1821 9C10.4201 8.998 8.9861 10.453 9.0001 12.182Z", fill: "#FAF7FF", stroke: "#FAF7FF", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })] }))); };
+exports.default = SvgInstagramNegativeFilled;

package/dist/components/Icon/index.js

@@ -27,9 +27,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BuyBig = exports.Buy = exports.ButtonIcon = exports.BoxLeft = exports.BoxDown = exports.Box = exports.Bookmark = exports.Bag3 = exports.Bag = exports.Bag2 = exports.Baby = exports.AskedQuestions = exports.ArrowUpSquare = exports.ArrowUpCircle = exports.ArrowUpBig = exports.ArrowUpAnimate = exports.ArrowUp = exports.ArrowSmallUp = exports.ArrowSmallRightStroke = exports.ArrowSmallRightBackground = exports.ArrowSmallRight = exports.ArrowSmallLeftStroke = exports.ArrowSmallLeftHover = exports.ArrowSmallLeft = exports.ArrowSmallDown = exports.ArrowShare = exports.ArrowRightSquare = exports.ArrowRightCircle = exports.ArrowRightBig = exports.ArrowRightAnimate = exports.ArrowRight = exports.ArrowPlusCircle = exports.ArrowMediumRight = exports.ArrowMedium = exports.ArrowLeftSquare = exports.ArrowLeftCircle = exports.ArrowLeftBig = exports.ArrowLeftAnimate = exports.ArrowLeft = exports.ArrowGo = exports.ArrowDownSquare = exports.ArrowDownCircle = exports.ArrowDownBig = exports.ArrowDownAnimate = exports.ArrowDown = exports.AgreementArrowUp = exports.AgreementArrowDown = exports.Again = exports.AddUser = exports.Activity = void 0;
 exports.House = exports.Home = exports.Hide = exports.Heart = exports.Graph = exports.Gift = exports.Game = exports.Folder = exports.FilterUp = exports.FilterDown = exports.Filter2 = exports.Filter = exports.Facebook = exports.ErrorIcon = exports.EditSquare = exports.Edit = exports.Download = exports.Document = exports.Discovery = exports.Discount = exports.Delete = exports.DarkBadge = exports.Danger = exports.Copy = exports.Closemini = exports.CloseSquare = exports.CloseMiniHover = exports.CloseHover = exports.CloseBigHover = exports.CloseBig = exports.Close = exports.CheckboxElementUncheck = exports.CheckboxElementInvalid = exports.CheckboxElementDisabled = exports.CheckboxElementChecked = exports.CheckMark = exports.Chat = exports.Chart = exports.Category = exports.CargoBack = exports.Cargo2 = exports.Cargo = exports.Cargo1 = exports.Campaign = exports.Camera = exports.Calling = exports.CallSilent = exports.CallMissed = exports.Call = exports.Calendar = void 0;
-exports.RadioButtonElementInvalid = exports.RadioButtonElementDisabled = exports.RadioButtonElementChecked = exports.Profile = exports.ProfilNamePassive = exports.ProfilName = exports.PriceTag = exports.PoweredByQnbLogo = exports.PlusSmall = exports.PlusBig = exports.Plus = exports.Play = exports.Password = exports.PaperUpload = exports.PaperPlus = exports.PaperNegative = exports.PaperFail = exports.PaperDownload = exports.Paper = exports.OrderProgressIcons = exports.NotificationSimpleSmall = exports.NotificationSimple = exports.Notification = exports.Notification1 = exports.NoHiddenCost = exports.NegativeSmall = exports.NegativeBig = exports.MoreSquare = exports.MoreCircle = exports.Money = exports.Minus = exports.Message = exports.Logout = exports.Login = exports.Lock = exports.Location = exports.Loading2 = exports.Loading = exports.List = exports.LinkedIn = exports.LikeV1 = exports.Like = exports.Laptop = exports.Language2 = exports.KeyboardClose = exports.Keyboard = exports.InstagramNegative = exports.InfoSquare = exports.InfoCircle = exports.Image = void 0;
-exports.HeartArrow = exports.Grid = exports.FacebookStroke = exports.Confetti = exports.Youtube = exports.Work = exports.Whatsapp = exports.WaveLoading = exports.WaveArrowUp = exports.WaveArrowDown = exports.Watch = exports.Wallet = exports.VolumeUp = exports.VolumeOff = exports.VolumeDown = exports.Voice2 = exports.Voice = exports.Video = exports.Upload = exports.Unlock = exports.TwoUser = exports.Twitter = exports.Trash = exports.TimeSquare = exports.TimeCircle = exports.TicketStar = exports.Ticket = exports.TickSquare = exports.ThreeUser = exports.Tamamlarsin = exports.SwitchPassive = exports.Swap = exports.Steps = exports.Steps2 = exports.Steps1 = exports.Star = exports.SignLanguage = exports.ShufflePlay = exports.Show = exports.ShieldFail = exports.ShieldDone = exports.Setting = exports.Setting1 = exports.Send = exports.Securitywithtik = exports.Search = exports.Scan = exports.Sandwatch = exports.Rectangle = exports.RadioButtonElementUnchecked = void 0;
-exports.iconList = exports.Visa = exports.TwitterStroke = exports.Pointinghand = exports.PointFinger = exports.Plant = exports.More = exports.Mastercard = exports.Live = exports.LinkedinStroke = exports.Lgbt = void 0;
+exports.RadioButtonElementDisabled = exports.RadioButtonElementChecked = exports.Profile = exports.ProfilNamePassive = exports.ProfilName = exports.PriceTag = exports.PoweredByQnbLogo = exports.PlusSmall = exports.PlusBig = exports.Plus = exports.Play = exports.Password = exports.PaperUpload = exports.PaperPlus = exports.PaperNegative = exports.PaperFail = exports.PaperDownload = exports.Paper = exports.OrderProgressIcons = exports.NotificationSimpleSmall = exports.NotificationSimple = exports.Notification = exports.Notification1 = exports.NoHiddenCost = exports.NegativeSmall = exports.NegativeBig = exports.MoreSquare = exports.MoreCircle = exports.Money = exports.Minus = exports.Message = exports.Logout = exports.Login = exports.Lock = exports.Location = exports.Loading2 = exports.Loading = exports.List = exports.LinkedIn = exports.LikeV1 = exports.Like = exports.Laptop = exports.Language2 = exports.KeyboardClose = exports.Keyboard = exports.InstagramNegativeFilled = exports.InstagramNegative = exports.InfoSquare = exports.InfoCircle = exports.Image = void 0;
+exports.Grid = exports.FacebookStroke = exports.Confetti = exports.Youtube = exports.Work = exports.Whatsapp = exports.WaveLoading = exports.WaveArrowUp = exports.WaveArrowDown = exports.Watch = exports.Wallet = exports.VolumeUp = exports.VolumeOff = exports.VolumeDown = exports.Voice2 = exports.Voice = exports.Video = exports.Upload = exports.Unlock = exports.TwoUser = exports.Twitter = exports.Trash = exports.TimeSquare = exports.TimeCircle = exports.TicketStar = exports.Ticket = exports.TickSquare = exports.ThreeUser = exports.Tamamlarsin = exports.SwitchPassive = exports.Swap = exports.Steps = exports.Steps2 = exports.Steps1 = exports.Star = exports.SignLanguage = exports.ShufflePlay = exports.Show = exports.ShieldFail = exports.ShieldDone = exports.Setting = exports.Setting1 = exports.Send = exports.Securitywithtik = exports.Search = exports.Scan = exports.Sandwatch = exports.Rectangle = exports.RadioButtonElementUnchecked = exports.RadioButtonElementInvalid = void 0;
+exports.iconList = exports.Visa = exports.TwitterStroke = exports.Pointinghand = exports.PointFinger = exports.Plant = exports.More = exports.Mastercard = exports.Live = exports.LinkedinStroke = exports.Lgbt = exports.HeartArrow = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var Activity_1 = __importDefault(require("./Activity"));
 Object.defineProperty(exports, "Activity", { enumerable: true, get: function () { return Activity_1.default; } });
@@ -239,6 +239,8 @@ var InfoSquare_1 = __importDefault(require("./InfoSquare"));
 Object.defineProperty(exports, "InfoSquare", { enumerable: true, get: function () { return InfoSquare_1.default; } });
 var InstagramNegative_1 = __importDefault(require("./InstagramNegative"));
 Object.defineProperty(exports, "InstagramNegative", { enumerable: true, get: function () { return InstagramNegative_1.default; } });
+var InstagramNegativeFilled_1 = __importDefault(require("./InstagramNegativeFilled"));
+Object.defineProperty(exports, "InstagramNegativeFilled", { enumerable: true, get: function () { return InstagramNegativeFilled_1.default; } });
 var Keyboard_1 = __importDefault(require("./Keyboard"));
 Object.defineProperty(exports, "Keyboard", { enumerable: true, get: function () { return Keyboard_1.default; } });
 var KeyboardClose_1 = __importDefault(require("./KeyboardClose"));
@@ -868,6 +870,10 @@ exports.iconList = {
         var props = __rest(_a, []);
         return (0, jsx_runtime_1.jsx)(InstagramNegative_1.default, __assign({}, props));
     },
+    InstagramNegativeFilled: function (_a) {
+        var props = __rest(_a, []);
+        return ((0, jsx_runtime_1.jsx)(InstagramNegativeFilled_1.default, __assign({}, props)));
+    },
     Keyboard: function (_a) {
         var props = __rest(_a, []);
         return (0, jsx_runtime_1.jsx)(Keyboard_1.default, __assign({}, props));

package/dist/components/Icon/stories/Icons.stories.js

@@ -20,8 +20,9 @@ var index_1 = require("../index");
 var Icon_styled_1 = require("../Icon.styled");
 var Icon_1 = __importDefault(require("../Icon"));
 var IconStoryList = function (props) {
+    var color = props.color, strokeWidth = props.strokeWidth, width = props.width, height = props.height;
     return ((0, jsx_runtime_1.jsx)(Icon_styled_1.IconStyled, { children: Object.entries(index_1.iconList).map(function (value, key) {
-            return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: 'item' }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "svg" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, __assign({}, props, { name: value[0] })) })), (0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: value[0] }))] })));
+            return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: 'item' }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "svg" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: value[0], color: color, strokeWidth: strokeWidth, width: width, height: height }) })), (0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: value[0] }))] })));
         }) }));
 };
 exports.default = {

package/dist/components/ProductCardVertical/ProductCardVertical.js

@@ -0,0 +1,48 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ProductCardVertical_styled_1 = require("./ProductCardVertical.styled");
+var react_i18next_1 = require("react-i18next");
+var Badges_1 = __importDefault(require("../Badges"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var ProductCardVertical = function (props) {
+    var title = props.title, description = props.description, hasDiscount = props.hasDiscount, price = props.price, oldPrice = props.oldPrice, oldPricePeriod = props.oldPricePeriod, slug = props.slug, period = props.period, discountRate = props.discountRate, isResponsive = props.isResponsive, image = props.image, component = props.component, other = __rest(props, ["title", "description", "hasDiscount", "price", "oldPrice", "oldPricePeriod", "slug", "period", "discountRate", "isResponsive", "image", "component"]);
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var LinkComponent = function (_a) {
+        var item = _a.item, children = _a.children;
+        return item.component ? ((0, jsx_runtime_1.jsx)(item.component, { children: children })) : ((0, jsx_runtime_1.jsx)("a", __assign({ href: item.slug }, { children: children })));
+    };
+    return ((0, jsx_runtime_1.jsx)(ProductCardVertical_styled_1.ProductCardVerticalStyled, __assign({ "$isResponsive": props.isResponsive, "$discountRate": props.discountRate }, other, { children: (0, jsx_runtime_1.jsxs)(LinkComponent, __assign({ item: props }, { children: [hasDiscount && (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") }) })), (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.jsxs)("div", __assign({ className: "period" }, { children: ["/ ", 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.jsxs)("div", __assign({ className: "period" }, { children: ["/ ", period] }))] }))] })] }))] }))] })) })));
+};
+ProductCardVertical.propTypes = {
+    isResponsive: prop_types_1.default.bool,
+};
+ProductCardVertical.defaultProps = {
+    isResponsive: false,
+};
+exports.default = ProductCardVertical;

package/dist/components/ProductCardVertical/ProductCardVertical.styled.js

@@ -0,0 +1,14 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProductCardVerticalStyled = void 0;
+var styled_components_1 = __importDefault(require("styled-components"));
+var devices_1 = require("../../constants/devices");
+exports.ProductCardVerticalStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  box-shadow: 0 6px 30px 0 #EAE9F0;\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  .cartBadge{\n    position: absolute;\n    left: 8px;\n    top: 8px;\n    z-index: 2;\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    > * {\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  }\n  .productCardContent{ \n    padding: 1rem 0 0.5rem 0;\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    .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: 8px;\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: 2px;\n        }\n      }\n\n      .oldPrice {\n        color: var(--dark-opacity-25);\n        margin-bottom: 2px;\n        .price, .period {\n          text-decoration: line-through;\n        }\n        .price{\n          font: var(--caption-semi-bold-12-15);\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        .period{\n          font: var(--body-regular-13-16);\n        }\n      }\n    }\n  }\n\n  ", "\n"], ["\n  box-shadow: 0 6px 30px 0 #EAE9F0;\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  .cartBadge{\n    position: absolute;\n    left: 8px;\n    top: 8px;\n    z-index: 2;\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    > * {\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  }\n  .productCardContent{ \n    padding: 1rem 0 0.5rem 0;\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    .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: 8px;\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: 2px;\n        }\n      }\n\n      .oldPrice {\n        color: var(--dark-opacity-25);\n        margin-bottom: 2px;\n        .price, .period {\n          text-decoration: line-through;\n        }\n        .price{\n          font: var(--caption-semi-bold-12-15);\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        .period{\n          font: var(--body-regular-13-16);\n        }\n      }\n    }\n  }\n\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        }\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  "); });
+var templateObject_1;

package/dist/components/ProductCardVertical/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ProductCardVertical_1 = require("./ProductCardVertical");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ProductCardVertical_1).default; } });

package/dist/components/ProductCardVertical/props.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var ProductCardDefault = {
+    isResponsive: false
+};

package/dist/components/ProductCardVertical/stories/ProductCardVertical.stories.js

@@ -0,0 +1,48 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var ProductCardVertical_1 = __importDefault(require("../ProductCardVertical"));
+exports.default = {
+    title: 'Components/ProductCard/ProductCard Vertical',
+    component: function (props) { return (0, jsx_runtime_1.jsx)("div", __assign({ style: { maxWidth: "240px" } }, { children: (0, jsx_runtime_1.jsx)(ProductCardVertical_1.default, __assign({}, props)) })); },
+    tags: ['autodocs'],
+    argTypes: {
+        disabled: { control: 'boolean' },
+        hasDiscount: { control: 'boolean' },
+    }
+};
+exports.Default = {
+    args: {
+        disabled: { control: 'boolean' },
+        hasDiscount: { control: 'boolean' },
+        title: "Apple İpad Air WİFİ 64GB (2020)",
+        description: "50Q9900 50'' 126 Ekran QLED Smart 4K Ultra HD TV",
+        price: "12.545,24 TL",
+        oldPrice: "12.545,24 TL",
+        component: function (_a) {
+            var children = _a.children;
+            return (0, jsx_runtime_1.jsx)("a", __assign({ href: "test" }, { children: children }));
+        },
+        discountRate: 32,
+        oldPricePeriod: "hafta",
+        period: "hafta",
+        content: "Content",
+        isMobile: false,
+        image: (0, jsx_runtime_1.jsx)("img", { src: "https://kiralarsin.s3.eu-central-1.amazonaws.com/products/4MOMSMAMAROOANAKUC_1.jpg", alt: "test" })
+    },
+};

package/dist/components/TextLink/TextLink.js

@@ -10,6 +10,17 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -18,8 +29,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var TextLink_styled_1 = require("./TextLink.styled");
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var TextLink = function (props) {
-    var onClick = props.onClick, children = props.children, href = props.href, target = props.target, icon = props.icon, iconWidth = props.iconWidth, iconHeight = props.iconHeight, size = props.size, iconDirection = props.iconDirection, iconStrokeWidth = props.iconStrokeWidth;
-    return ((0, jsx_runtime_1.jsx)(TextLink_styled_1.TextLinkStyled, __assign({ size: size, href: href, target: target, onClick: onClick }, props, { children: (0, jsx_runtime_1.jsxs)(TextLink_styled_1.Inner, __assign({ iconDirection: iconDirection }, { children: [icon && ((0, jsx_runtime_1.jsx)(TextLink_styled_1.IconStyled, __assign({ iconDirection: iconDirection }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: icon, width: iconWidth, height: iconHeight }) }))), children] })) })));
+    var onClick = props.onClick, children = props.children, href = props.href, target = props.target, iconWidth = props.iconWidth, iconHeight = props.iconHeight, icon = props.icon, variant = props.variant, size = props.size, iconDirection = props.iconDirection, iconStrokeWidth = props.iconStrokeWidth, other = __rest(props, ["onClick", "children", "href", "target", "iconWidth", "iconHeight", "icon", "variant", "size", "iconDirection", "iconStrokeWidth"]);
+    return ((0, jsx_runtime_1.jsx)(TextLink_styled_1.TextLinkStyled, __assign({ "$size": size, "$variant": variant, href: href, target: target, onClick: onClick }, other, { children: (0, jsx_runtime_1.jsxs)(TextLink_styled_1.Inner, __assign({ "$iconDirection": iconDirection }, { children: [icon && ((0, jsx_runtime_1.jsx)(TextLink_styled_1.IconStyled, __assign({ "$iconDirection": iconDirection }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: icon, width: iconWidth, height: iconHeight }) }))), children] })) })));
 };
 TextLink.defaultProps = {
     iconWidth: "24px",

package/dist/components/TextLink/TextLink.styled.js

@@ -9,8 +9,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Inner = exports.IconStyled = exports.TextLinkStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
-exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"], ["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"])), function (props) { return props.variant === "primary" ? "var(--primary)" : "var(--grey-50)"; }, function (props) {
-    switch (props.size) {
+exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"], ["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"])), function (props) { return props.$variant === "primary" ? "var(--primary)" : "var(--grey-50)"; }, function (props) {
+    switch (props.$size) {
         case 'small':
             return "0";
         case 'medium':
@@ -18,7 +18,7 @@ exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (temp
         default:
             return "0";
     }
-}, function (props) { return props.variant === "primary" ? "var(--primary-hover)" : "var(--grey-50)"; });
-exports.IconStyled = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", ";\n"], ["\n    ", ";\n"])), function (props) { return props.iconDirection === 'right' ? "margin-left: 0.5rem;" : 'margin-right: 0.5rem;'; });
-exports.Inner = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"])), function (props) { return props.iconDirection === 'right' ? "row-reverse" : 'row'; });
+}, function (props) { return props.$variant === "primary" ? "var(--primary-hover)" : "var(--grey-50)"; });
+exports.IconStyled = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", ";\n"], ["\n    ", ";\n"])), function (props) { return props.$iconDirection === 'right' ? "margin-left: 0.5rem;" : 'margin-right: 0.5rem;'; });
+exports.Inner = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"])), function (props) { return props.$iconDirection === 'right' ? "row-reverse" : 'row'; });
 var templateObject_1, templateObject_2, templateObject_3;

package/dist/components/Tooltip/Tooltip.js

@@ -20,14 +20,14 @@ var Tooltip_styled_1 = require("./Tooltip.styled");
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var useOnClickOutside_1 = __importDefault(require("../../hooks/useOnClickOutside"));
 var Tooltip = function (props) {
-    var children = props.children, title = props.title, hasClickAction = props.hasClickAction, isOpen = props.isOpen, iconWidth = props.iconWidth, iconHeight = props.iconHeight, popupWidth = props.popupWidth, position = props.position, hasCloseOnOutsideClick = props.hasCloseOnOutsideClick, popupSize = props.popupSize, popupLeft = props.popupLeft, popupRight = props.popupRight, popupTop = props.popupTop, popupBottom = props.popupBottom, iconStrokeWidth = props.iconStrokeWidth;
+    var children = props.children, title = props.title, hasClickAction = props.hasClickAction, isOpen = props.isOpen, iconWidth = props.iconWidth, iconHeight = props.iconHeight, popupWidth = props.popupWidth, position = props.position, hasCloseOnOutsideClick = props.hasCloseOnOutsideClick, popupSize = props.popupSize, popupLeft = props.popupLeft, popupRight = props.popupRight, iconStrokeWidth = props.iconStrokeWidth;
     var _a = (0, react_1.useState)(isOpen), isOpenTooltip = _a[0], setIsOpenTooltip = _a[1];
     (0, react_1.useEffect)(function () {
         setIsOpenTooltip(isOpen);
     }, [isOpen]);
     var tooltipRef = (0, react_1.useRef)();
     (0, useOnClickOutside_1.default)(tooltipRef, function () { return setIsOpenTooltip(false); }, hasCloseOnOutsideClick);
-    return ((0, jsx_runtime_1.jsxs)(Tooltip_styled_1.TooltipStyled, __assign({ ref: tooltipRef, hasClickAction: hasClickAction }, { children: [(0, jsx_runtime_1.jsx)(Tooltip_styled_1.Selector, __assign({ isOpen: isOpenTooltip, position: position, hasClickAction: hasClickAction, onClick: function () { return setIsOpenTooltip(!isOpenTooltip); } }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: "InfoSquare", width: iconWidth, height: iconHeight }) })), (0, jsx_runtime_1.jsxs)(Tooltip_styled_1.Popup, __assign({ popupSize: popupSize, iconWidth: iconWidth, position: position, popupWidth: popupWidth, isOpen: isOpenTooltip, hasClickAction: hasClickAction, popupLeft: popupLeft, popupRight: popupRight, popupTop: popupTop, popupBottom: popupBottom }, { children: [title && (0, jsx_runtime_1.jsx)(Tooltip_styled_1.Title, { children: title }), children] }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Tooltip_styled_1.TooltipStyled, __assign({ ref: tooltipRef, "$hasClickAction": hasClickAction }, { children: [(0, jsx_runtime_1.jsx)(Tooltip_styled_1.Selector, __assign({ "$isOpen": isOpenTooltip, "$position": position, "$hasClickAction": hasClickAction, onClick: function () { return setIsOpenTooltip(!isOpenTooltip); } }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: "InfoSquare", width: iconWidth, height: iconHeight }) })), (0, jsx_runtime_1.jsxs)(Tooltip_styled_1.Popup, __assign({ "$popupSize": popupSize, "$position": position, "$popupWidth": popupWidth, "$isOpen": isOpenTooltip, "$hasClickAction": hasClickAction, "$popupLeft": popupLeft, "$popupRight": popupRight }, { children: [title && (0, jsx_runtime_1.jsx)(Tooltip_styled_1.Title, { children: title }), children] }))] })));
 };
 Tooltip.defaultProps = {
     iconWidth: "16px",

package/dist/components/Tooltip/Tooltip.styled.js

@@ -10,9 +10,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Popup = exports.Title = exports.Selector = exports.TooltipStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
 var devices_1 = require("../../constants/devices");
-exports.TooltipStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: block;\n  position: relative;\n  vertical-align: middle;\n  color: var(--dark);\n  ", "\n"], ["\n  display: block;\n  position: relative;\n  vertical-align: middle;\n  color: var(--dark);\n  ", "\n"])), function (props) { return !props.hasClickAction && "\n      &:hover {\n        > div {\n          opacity: 1;\n          :before{\n            opacity:1;\n          }\n        }\n      }\n  "; });
-exports.Selector = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: block;\n  cursor: ", ";\n  position: relative;\n  div {\n    display: block;\n    color: var(--primary);\n  }\n\n  ", "\n  &:before {\n    content: '';\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%) rotate(45deg);\n    right: auto;\n    transition: all 0.15s ease;\n    background-color: var(--primary-opacity-10);\n    width: 12px;\n    height: 12px;\n    border-radius: 3px;\n    opacity: ", ";\n    ", ";\n  }\n"], ["\n  display: block;\n  cursor: ", ";\n  position: relative;\n  div {\n    display: block;\n    color: var(--primary);\n  }\n\n  ", "\n  &:before {\n    content: '';\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%) rotate(45deg);\n    right: auto;\n    transition: all 0.15s ease;\n    background-color: var(--primary-opacity-10);\n    width: 12px;\n    height: 12px;\n    border-radius: 3px;\n    opacity: ", ";\n    ", ";\n  }\n"])), function (props) { return props.hasClickAction ? 'pointer' : 'initial'; }, function (props) { return (!props.hasClickAction) ? "\n    &:hover{\n      &:before{\n        opacity: 1;\n      }\n    }\n  " : null; }, function (props) { return (props.hasClickAction && props.isOpen) ? '1' : "0"; }, function (props) {
-    switch (props.position) {
+exports.TooltipStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: block;\n  position: relative;\n  vertical-align: middle;\n  color: var(--dark);\n  ", "\n"], ["\n  display: block;\n  position: relative;\n  vertical-align: middle;\n  color: var(--dark);\n  ", "\n"])), function (props) { return !props.$hasClickAction && "\n      &:hover {\n        > div {\n          opacity: 1;\n          :before{\n            opacity:1;\n          }\n        }\n      }\n  "; });
+exports.Selector = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: block;\n  cursor: ", ";\n  position: relative;\n  div {\n    display: block;\n    color: var(--primary);\n  }\n\n  ", "\n  &:before {\n    content: '';\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%) rotate(45deg);\n    right: auto;\n    transition: all 0.15s ease;\n    background-color: var(--primary-opacity-10);\n    width: 12px;\n    height: 12px;\n    border-radius: 3px;\n    opacity: ", ";\n    ", ";\n  }\n"], ["\n  display: block;\n  cursor: ", ";\n  position: relative;\n  div {\n    display: block;\n    color: var(--primary);\n  }\n\n  ", "\n  &:before {\n    content: '';\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%) rotate(45deg);\n    right: auto;\n    transition: all 0.15s ease;\n    background-color: var(--primary-opacity-10);\n    width: 12px;\n    height: 12px;\n    border-radius: 3px;\n    opacity: ", ";\n    ", ";\n  }\n"])), function (props) { return props.$hasClickAction ? 'pointer' : 'initial'; }, function (props) { return (!props.$hasClickAction) ? "\n    &:hover{\n      &:before{\n        opacity: 1;\n      }\n    }\n  " : null; }, function (props) { return (props.$hasClickAction && props.$isOpen) ? '1' : "0"; }, function (props) {
+    switch (props.$position) {
         case 'bottomRight':
             return "\n            top: calc(100% + 4px);\n        ";
         case 'bottomCenter':
@@ -30,8 +30,8 @@ exports.Selector = styled_components_1.default.div(templateObject_2 || (template
     }
 });
 exports.Title = styled_components_1.default.strong(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  margin-bottom: 0.5rem;\n  font:var(--body-extra-bold-13-16);\n"], ["\n  display: block;\n  margin-bottom: 0.5rem;\n  font:var(--body-extra-bold-13-16);\n"])));
-exports.Popup = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  max-width: ", ";\n  width: calc(100vw - 4.5rem);\n  padding: ", ";\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-10);\n  z-index: 99999;\n  box-sizing: border-box;\n  user-select: none;\n  pointer-events: none;\n  transition: all 0.15s ease;\n  opacity: ", ";\n  font:var(--caption-medium-11-13);\n  ", ";\n\n  @media only screen and ", " {\n    left: auto;\n    transform: none;\n    right: ", " !important;\n  }\n"], ["\n  position: absolute;\n  max-width: ", ";\n  width: calc(100vw - 4.5rem);\n  padding: ", ";\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-10);\n  z-index: 99999;\n  box-sizing: border-box;\n  user-select: none;\n  pointer-events: none;\n  transition: all 0.15s ease;\n  opacity: ", ";\n  font:var(--caption-medium-11-13);\n  ", ";\n\n  @media only screen and ", " {\n    left: auto;\n    transform: none;\n    right: ", " !important;\n  }\n"])), function (props) { return props.popupWidth ? props.popupWidth : "151px"; }, function (props) {
-    switch (props.popupSize) {
+exports.Popup = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  max-width: ", ";\n  width: calc(100vw - 4.5rem);\n  padding: ", ";\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-10);\n  z-index: 99999;\n  box-sizing: border-box;\n  user-select: none;\n  pointer-events: none;\n  transition: all 0.15s ease;\n  opacity: ", ";\n  font:var(--caption-medium-11-13);\n  ", ";\n\n  @media only screen and ", " {\n    left: auto;\n    transform: none;\n    right: ", " !important;\n  }\n"], ["\n  position: absolute;\n  max-width: ", ";\n  width: calc(100vw - 4.5rem);\n  padding: ", ";\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-10);\n  z-index: 99999;\n  box-sizing: border-box;\n  user-select: none;\n  pointer-events: none;\n  transition: all 0.15s ease;\n  opacity: ", ";\n  font:var(--caption-medium-11-13);\n  ", ";\n\n  @media only screen and ", " {\n    left: auto;\n    transform: none;\n    right: ", " !important;\n  }\n"])), function (props) { return props.$popupWidth ? props.$popupWidth : "151px"; }, function (props) {
+    switch (props.$popupSize) {
         case 'small':
             return "10px";
         case 'medium':
@@ -39,22 +39,22 @@ exports.Popup = styled_components_1.default.div(templateObject_4 || (templateObj
         default:
             return "10px";
     }
-}, function (props) { return (props.hasClickAction && props.isOpen) ? '1' : "0"; }, function (props) {
-    switch (props.position) {
+}, function (props) { return (props.$hasClickAction && props.$isOpen) ? '1' : "0"; }, function (props) {
+    switch (props.$position) {
         case 'bottomRight':
-            return "\n          right: ".concat(props.popupRight || '-22px', ";\n          top: calc(100% + 10px);\n        ");
+            return "\n          right: ".concat(props.$popupRight || '-22px', ";\n          top: calc(100% + 10px);\n        ");
         case 'bottomCenter':
             return "\n          left: 50%;\n          top: calc(100% + 10px);\n          transform: translateX(-50%);\n        ";
         case 'bottomLeft':
-            return "\n          left: ".concat(props.popupLeft || '-22px', ";\n          top: calc(100% + 10px);\n        ");
+            return "\n          left: ".concat(props.$popupLeft || '-22px', ";\n          top: calc(100% + 10px);\n        ");
         case 'topRight':
-            return "\n          right: ".concat(props.popupRight || '-22px', ";\n          bottom: calc(100% + 10px);\n        ");
+            return "\n          right: ".concat(props.$popupRight || '-22px', ";\n          bottom: calc(100% + 10px);\n        ");
         case 'topCenter':
             return "\n          left: 50%;\n          bottom: calc(100% + 10px);\n          transform: translateX(-50%);\n        ";
         case 'topLeft':
-            return "\n          left: ".concat(props.popupLeft || '-22px', ";\n          bottom: calc(100% + 10px);\n        ");
+            return "\n          left: ".concat(props.$popupLeft || '-22px', ";\n          bottom: calc(100% + 10px);\n        ");
         default:
             return "\n          left: 50%;\n          bottom: calc(100% + 10px);\n          transform: translateX(-50%);\n        ";
     }
-}, devices_1.devices.xl, function (props) { return props.popupRight || "-1.5rem"; });
+}, devices_1.devices.xl, function (props) { return props.$popupRight || "-1.5rem"; });
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BannerCard = exports.AutocompleteInput = exports.Slider = exports.InstallmentBox = exports.AddressCard = exports.ReviewCard = exports.trLocale = exports.enLocale = exports.initi18n = exports.initReactI18next = exports.CampaignCard = exports.Dropdown = exports.InlineProgress = exports.Loader = exports.ShoppingCartProduct = exports.CouponCode = exports.InfoBox = exports.ContentBox = exports.ListGroup = exports.InsuranceBox = exports.Tooltip = exports.TextLink = exports.SelectBox = exports.Badges = exports.Carousel = exports.SuggestBox = exports.Toast = exports.Banner = exports.Accordion = exports.Divider = exports.SearchBox = exports.ValueProposition = exports.Textarea = exports.ActionButton = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Button = void 0;
+exports.ProductCardVertical = exports.BannerCard = exports.AutocompleteInput = exports.Slider = exports.InstallmentBox = exports.AddressCard = exports.ReviewCard = exports.trLocale = exports.enLocale = exports.initi18n = exports.initReactI18next = exports.CampaignCard = exports.Dropdown = exports.InlineProgress = exports.Loader = exports.ShoppingCartProduct = exports.CouponCode = exports.InfoBox = exports.ContentBox = exports.ListGroup = exports.InsuranceBox = exports.Tooltip = exports.TextLink = exports.SelectBox = exports.Badges = exports.Carousel = exports.SuggestBox = exports.Toast = exports.Banner = exports.Accordion = exports.Divider = exports.SearchBox = exports.ValueProposition = exports.Textarea = exports.ActionButton = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Button = void 0;
 var Button_1 = __importDefault(require("./components/Button"));
 exports.Button = Button_1.default;
 var Breadcrumbs_1 = __importDefault(require("./components/Breadcrumbs"));
@@ -98,5 +98,7 @@ var AutocompleteInput_1 = __importDefault(require("./components/AutocompleteInpu
 exports.AutocompleteInput = AutocompleteInput_1.default;
 var BannerCard_1 = __importDefault(require("./components/BannerCard"));
 exports.BannerCard = BannerCard_1.default;
+var ProductCardVertical_1 = __importDefault(require("./components/ProductCardVertical"));
+exports.ProductCardVertical = ProductCardVertical_1.default;
 var react_slick_1 = __importDefault(require("react-slick"));
 exports.Slider = react_slick_1.default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "krl-alfred",
-  "version": "1.76.36",
+  "version": "1.76.37",
   "files": [
     "dist"
   ],