krl-alfred 1.71.4 → 1.71.6
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.
- package/dist/components/ActionButton/ActionButton.js +1 -1
- package/dist/components/CouponCode/CouponCode.js +2 -1
- package/dist/components/CouponCode/stories/CouponCode.stories.js +4 -2
- package/dist/components/Icon/Delete.js +1 -1
- package/dist/components/Icon/NegativeSmall.js +1 -1
- package/dist/components/Icon/PlusSmall.js +1 -1
- package/dist/components/InsuranceBox/InsuranceBox.js +1 -1
- package/dist/components/ShoppingCartProduct/ShoppingCartProduct.js +1 -1
- package/dist/components/ShoppingCartProduct/ShoppingCartProduct.styled.js +1 -1
- package/dist/components/ShoppingCartProduct/stories/ShoppingCartProduct.stories.js +2 -1
- package/dist/components/Tooltip/Tooltip.js +2 -2
- package/dist/components/Tooltip/Tooltip.styled.js +29 -20
- package/dist/components/Tooltip/props.js +2 -1
- package/dist/components/Tooltip/stories/Tooltip.stories.js +6 -0
- package/package.json +1 -1
|
@@ -26,8 +26,8 @@ var ActionButton = function (props) {
|
|
|
26
26
|
var _c = (0, react_1.useState)(0), hours = _c[0], setHours = _c[1];
|
|
27
27
|
//const [secounds,setSecounds] = useState(0);
|
|
28
28
|
var deadline = new Date(props.date).getTime();
|
|
29
|
-
var now = new Date().getTime();
|
|
30
29
|
var count = function () {
|
|
30
|
+
var now = new Date().getTime();
|
|
31
31
|
var duration = (0, date_fns_1.intervalToDuration)({
|
|
32
32
|
start: deadline,
|
|
33
33
|
end: now
|
|
@@ -29,7 +29,7 @@ var CouponCode = function (props) {
|
|
|
29
29
|
setExpanded(props.expanded);
|
|
30
30
|
}, [props.expanded]);
|
|
31
31
|
var toggleExpand = function () { return setExpanded(function (prevState) { return !prevState; }); };
|
|
32
|
-
return ((0, jsx_runtime_1.jsxs)(CouponCode_styled_1.CouponCodeStyled, __assign({}, props, { expanded: expanded, children: [(0, jsx_runtime_1.jsxs)("div", { onClick: toggleExpand, className: "header", children: [(0, jsx_runtime_1.jsx)("div", { className: "title body-bold-14-17", children: props.title }), (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "ArrowSmallDown", width: "24px", height: "24px" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "body", children: [(0, jsx_runtime_1.jsx)(Input_1.default, { disabled: props.isInputDisabled, name: props.name, onChange: props.onChange, hasError: props.hasError, errorMessage: props.errorMessage, value: props.value, autofocus: props.autoFocus, label: "", width: "auto", placeholder:
|
|
32
|
+
return ((0, jsx_runtime_1.jsxs)(CouponCode_styled_1.CouponCodeStyled, __assign({}, props, { expanded: expanded, children: [(0, jsx_runtime_1.jsxs)("div", { onClick: toggleExpand, className: "header", children: [(0, jsx_runtime_1.jsx)("div", { className: "title body-bold-14-17", children: props.title }), (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "ArrowSmallDown", width: "24px", height: "24px" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "body", children: [(0, jsx_runtime_1.jsx)(Input_1.default, { disabled: props.isInputDisabled, name: props.name, onChange: props.onChange, hasError: props.hasError, errorMessage: props.errorMessage, value: props.value, autofocus: props.autoFocus, label: "", width: "auto", placeholder: props.placeholder, alwaysShowMask: false, hasCopyButton: false }), (0, jsx_runtime_1.jsx)(Button_1.default, { width: props.buttonWidth, isLoading: props.isButtonLoading, disabled: props.buttonDisabled, size: "big", variant: props.buttonVariant, children: props.buttonText })] })] })));
|
|
33
33
|
};
|
|
34
34
|
CouponCode.defaultProps = {
|
|
35
35
|
title: "Title",
|
|
@@ -43,5 +43,6 @@ CouponCode.defaultProps = {
|
|
|
43
43
|
errorMessage: "",
|
|
44
44
|
buttonVariant: "primary",
|
|
45
45
|
buttonWidth: "96px",
|
|
46
|
+
placeholder: "İndirim kodunu gir",
|
|
46
47
|
};
|
|
47
48
|
exports.default = CouponCode;
|
|
@@ -36,5 +36,5 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
36
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
37
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
38
|
var React = __importStar(require("react"));
|
|
39
|
-
var SvgDelete = function (props) { return ((0, jsx_runtime_1.
|
|
39
|
+
var SvgDelete = function (props) { return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: 14, height: 16, viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: (0, jsx_runtime_1.jsx)("g", { id: "Delete", children: (0, jsx_runtime_1.jsx)("path", { id: "Vector", d: "M11.8831 6.97964C11.8831 6.97964 11.5211 11.4696 11.3111 13.361C11.2111 14.2643 10.6531 14.7936 9.73913 14.8103C7.9998 14.8416 6.25847 14.8436 4.5198 14.807C3.64047 14.789 3.0918 14.253 2.9938 13.3656C2.78247 11.4576 2.42247 6.97964 2.42247 6.97964M12.8053 4.16048L1.5 4.16048M11.2937 4.16064C10.7704 4.16064 9.65305 3.12397 9.55038 2.6113L9.38838 1.80064C9.28838 1.42664 8.94972 1.16797 8.56372 1.16797L5.74172 1.16797C5.35572 1.16797 5.01705 1.42664 4.91705 1.80064L4.75505 2.6113C4.65238 3.12397 3.53505 4.16064 3.01172 4.16064", stroke: "#0A103D", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }) }) }))); };
|
|
40
40
|
exports.default = SvgDelete;
|
|
@@ -36,5 +36,5 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
36
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
37
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
38
|
var React = __importStar(require("react"));
|
|
39
|
-
var SvgNegativeSmall = function (props) { return ((0, jsx_runtime_1.jsx)("svg", __assign({ width:
|
|
39
|
+
var SvgNegativeSmall = function (props) { return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: (0, jsx_runtime_1.jsx)("g", { id: "NegativeSmall", children: (0, jsx_runtime_1.jsx)("g", { id: "Plus", children: (0, jsx_runtime_1.jsx)("path", { id: "Line_186", d: "M10.4436 7.99294H5.55469", stroke: "#0A103D", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }) }) }) }))); };
|
|
40
40
|
exports.default = SvgNegativeSmall;
|
|
@@ -36,5 +36,5 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
36
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
37
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
38
|
var React = __importStar(require("react"));
|
|
39
|
-
var SvgPlusSmall = function (props) { return ((0, jsx_runtime_1.
|
|
39
|
+
var SvgPlusSmall = function (props) { return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: (0, jsx_runtime_1.jsx)("g", { id: "arrow/+", children: (0, jsx_runtime_1.jsxs)("g", { id: "i-add", children: [(0, jsx_runtime_1.jsx)("path", { id: "Path", d: "M10.666 8.00104L5.33268 8.00104", stroke: "#0A103D", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { id: "Path_2", d: "M7.99896 10.6673L7.99896 5.33398", stroke: "#0A103D", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })] }) }) }))); };
|
|
40
40
|
exports.default = SvgPlusSmall;
|
|
@@ -13,7 +13,7 @@ var InsuranceBox = function (props) {
|
|
|
13
13
|
var InsuranceText = function () {
|
|
14
14
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h1", { className: "body-extra-bold-13-16", children: "Tamamlars\u0131n %100\u2019e Tamamlay\u0131c\u0131 Ek G\u00FCvence Paketi" }), (0, jsx_runtime_1.jsx)("p", { className: "caption-medium-11-13", children: "Tamamlars\u0131n, kira s\u00FCren boyunca cihaz\u0131na ek g\u00FCvence sa\u011Flar. Ek g\u00FCvence kapsam\u0131nda cihaz\u0131n de\u011Fi\u015Ftirilir veya \u00FCcretsiz onar\u0131l\u0131r. Ek g\u00FCvenceli kiralamalarda kira s\u00FCreni uzat\u0131rken, yeni kira s\u00FCresine ait ek g\u00FCvencen otomatik olarak sepete eklenir. Ek g\u00FCvencesiz yap\u0131lan kiralamalarda, s\u00FCre uzat\u0131m\u0131 s\u0131ras\u0131nda sonradan ek g\u00FCvence eklenemez." }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "D\u00FC\u015Fme, \u00E7arpma gibi kazalarda olu\u015Fan hasarlar" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "S\u0131v\u0131 temas\u0131" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "Ekran vb par\u00E7a k\u0131r\u0131lmalar\u0131" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "\u00C7izilmeler" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "Kutu hasarlar\u0131" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "K\u0131sa devre, voltaj nedeniyle olu\u015Fabilecek sorunlar" }), (0, jsx_runtime_1.jsx)("li", { className: "caption-medium-11-13", children: "Hatal\u0131 aksesuar kullan\u0131m\u0131 sorunlar\u0131" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "caption-medium-11-13", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Uyar\u0131:" }), " Kay\u0131p, \u00E7al\u0131nma, kas\u0131tl\u0131 zarar verme, onar\u0131lamaz duruma getirme, cihaz\u0131n kutusunu kaybetme gibi durumlarda ve 5.000 TL\u2019yi a\u015Fan hasarlarda ek g\u00FCvence paketi ge\u00E7erli de\u011Fildir."] })] }));
|
|
15
15
|
};
|
|
16
|
-
return ((0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.InsuranceBoxStyled, { hasBorder: hasBorder, hasBgColor: hasBgColor, width: width, height: height, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { disabled: disabled, onChange: onChange, checked: checked, size: "large" }) }), (0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.InnerWrapper, { children: [(0, jsx_runtime_1.jsx)(InsuranceBox_styled_1.Logo, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Tamamlarsin", width: isMobile ? "116px" : "64.51px", height: isMobile ? "13.25px" : "7.37px" }) }), (0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.DescriptionWrapper, { children: [(0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.Description, { className: "caption-semi-bold-12-15", children: ["Hasar g\u00FCvenceni %100\u2019e ", isTitleWrap && (0, jsx_runtime_1.jsx)("br", {}), "tamamlars\u0131n! ", (0, jsx_runtime_1.jsx)("b", { className: "body-extra-bold-13-16", children: priceText })] }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { title: tooltipTitle, position: tooltipPosition, hasCloseOnOutsideClick: hasCloseOnOutsideClick, hasClickAction: true, popupWidth: popupWidth, iconWidth: "24px", iconHeight: "24px", children: tooltipDescription || ((0, jsx_runtime_1.jsx)(InsuranceBox_styled_1.TooltipDescription, { children: (0, jsx_runtime_1.jsx)(InsuranceText, {}) })) })] })] })] }));
|
|
16
|
+
return ((0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.InsuranceBoxStyled, { hasBorder: hasBorder, hasBgColor: hasBgColor, width: width, height: height, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { disabled: disabled, onChange: onChange, checked: checked, size: "large" }) }), (0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.InnerWrapper, { children: [(0, jsx_runtime_1.jsx)(InsuranceBox_styled_1.Logo, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Tamamlarsin", width: isMobile ? "116px" : "64.51px", height: isMobile ? "13.25px" : "7.37px" }) }), (0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.DescriptionWrapper, { children: [(0, jsx_runtime_1.jsxs)(InsuranceBox_styled_1.Description, { className: "caption-semi-bold-12-15", children: ["Hasar g\u00FCvenceni %100\u2019e ", isTitleWrap && (0, jsx_runtime_1.jsx)("br", {}), "tamamlars\u0131n! ", (0, jsx_runtime_1.jsx)("b", { className: "body-extra-bold-13-16", children: priceText })] }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { popupSize: "medium", title: tooltipTitle, position: tooltipPosition, hasCloseOnOutsideClick: hasCloseOnOutsideClick, hasClickAction: true, popupWidth: popupWidth, iconWidth: "24px", iconHeight: "24px", children: tooltipDescription || ((0, jsx_runtime_1.jsx)(InsuranceBox_styled_1.TooltipDescription, { children: (0, jsx_runtime_1.jsx)(InsuranceText, {}) })) })] })] })] }));
|
|
17
17
|
};
|
|
18
18
|
InsuranceBox.defaultProps = {
|
|
19
19
|
height: "90px",
|
|
@@ -25,7 +25,7 @@ var ShoppingCartProduct = function (props) {
|
|
|
25
25
|
var item = _a.item, children = _a.children;
|
|
26
26
|
return item.component ? ((0, jsx_runtime_1.jsx)(item.component, { children: children })) : ((0, jsx_runtime_1.jsx)("a", { href: item.slug, children: children }));
|
|
27
27
|
};
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)(ShoppingCartProduct_styled_1.ShoppingCartProductStyled, __assign({}, props, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "inner", children: [(0, jsx_runtime_1.jsx)("div", { className: "img", children: props.image }), (0, jsx_runtime_1.jsxs)("div", { className: "text", children: [(0, jsx_runtime_1.jsx)(LinkComponent, { item: props, children: (0, jsx_runtime_1.jsx)("strong", { className: "productCardTitle title-semi-bold-16-19", children: props.title }) }), (0, jsx_runtime_1.jsxs)("div", { className: "productCardPriceContent", children: [props.discountRate > 0 && (0, jsx_runtime_1.jsxs)("div", { className: "discountRate body-extra-bold-13-16", children: ["%", props.discountRate] }), (0, jsx_runtime_1.jsxs)("div", { children: [props.oldPrice && props.discountRate > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "oldPrice", children: [(0, jsx_runtime_1.jsx)("div", { className: "price caption-semi-bold-12-15", children: props.oldPrice }), (0, jsx_runtime_1.jsxs)("div", { className: "period caption-regular-12-15", children: ["/ ", props.oldPricePeriod] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "newPrice", children: [(0, jsx_runtime_1.jsx)("div", { className: "price body-extra-bold-14-17", children: props.price }), (0, jsx_runtime_1.jsxs)("div", { className: "period body-regular-13-16", children: ["/ ", props.period] })] })] })] }), (0, jsx_runtime_1.
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)(ShoppingCartProduct_styled_1.ShoppingCartProductStyled, __assign({}, props, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "inner", children: [(0, jsx_runtime_1.jsx)("div", { className: "img", children: props.image }), (0, jsx_runtime_1.jsxs)("div", { className: "text", children: [(0, jsx_runtime_1.jsx)(LinkComponent, { item: props, children: (0, jsx_runtime_1.jsx)("strong", { className: "productCardTitle title-semi-bold-16-19", children: props.title }) }), (0, jsx_runtime_1.jsxs)("div", { className: "productCardPriceContent", children: [props.discountRate > 0 && (0, jsx_runtime_1.jsxs)("div", { className: "discountRate body-extra-bold-13-16", children: ["%", props.discountRate] }), (0, jsx_runtime_1.jsxs)("div", { children: [props.oldPrice && props.discountRate > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "oldPrice", children: [(0, jsx_runtime_1.jsx)("div", { className: "price caption-semi-bold-12-15", children: props.oldPrice }), (0, jsx_runtime_1.jsxs)("div", { className: "period caption-regular-12-15", children: ["/ ", props.oldPricePeriod] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "newPrice", children: [(0, jsx_runtime_1.jsx)("div", { className: "price body-extra-bold-14-17", children: props.price }), (0, jsx_runtime_1.jsxs)("div", { className: "period body-regular-13-16", children: ["/ ", props.period] })] })] })] }), (0, jsx_runtime_1.jsxs)("p", { className: "productCardDeliveryText body-medium-13-16", children: [props.deliveryDangerText && (0, jsx_runtime_1.jsx)("span", { className: "productCardDeliveryDanger", children: props.deliveryDangerText }), props.deliveryText] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "actions", children: [(0, jsx_runtime_1.jsxs)(ShoppingCartProduct_styled_1.ActionButton, { disabled: props.hasLoading || props.hasError, onClick: props.onIncrement, className: "actionButton", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { name: "PlusSmall", width: "16px", height: "16px" }), props.hasError && (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)("popup", "caption-semi-bold-12-15"), children: props.errorText })] }), (0, jsx_runtime_1.jsx)("div", { className: "quantity body-extra-bold-13-16", children: props.hasLoading ? (0, jsx_runtime_1.jsx)(Spinner_1.default, { variant: "primary", width: "16px", height: "16px" }) : props.quantity }), props.hasRemove ? ((0, jsx_runtime_1.jsx)(ShoppingCartProduct_styled_1.ActionButton, { disabled: props.hasLoading, onClick: props.onRemove, className: "actionButton", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Delete", width: "16px", height: "16px" }) })) : ((0, jsx_runtime_1.jsx)(ShoppingCartProduct_styled_1.ActionButton, { disabled: props.hasLoading, onClick: props.onDecrement, className: "actionButton", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "NegativeSmall", width: "16px", height: "16px" }) }))] })] }), props.hasInsurance && ((0, jsx_runtime_1.jsxs)("div", { onClick: !props.hasLoading && props.toggleInsurance, className: "insurance", children: [(0, jsx_runtime_1.jsx)("div", { className: "insuranceImg", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Tamamlarsin", width: "64.51px", height: "7.37px" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text caption-semi-bold-12-15", children: [props.insuranceText, props.insurancePrice && (0, jsx_runtime_1.jsxs)("p", { className: "price caption-extra-bold-12-15", children: [props.insurancePrice, (0, jsx_runtime_1.jsx)("span", { className: "quantity", children: props.insuranceQuantity })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "actions", children: props.hasInsuranceTooltip ? ((0, jsx_runtime_1.jsx)(Tooltip_1.default, { popupRight: "-12px", popupWidth: props.insuranceTooltipWidth, position: "bottomRight", children: props.insuranceTooltipText })) : (props.insurancePrice ? ((0, jsx_runtime_1.jsx)(ShoppingCartProduct_styled_1.ActionButton, { disabled: props.hasLoading, className: "actionButton", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Delete", width: "16px", height: "16px" }) })) : ((0, jsx_runtime_1.jsx)(ShoppingCartProduct_styled_1.ActionButton, { disabled: props.hasLoading, className: "actionButton", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "ArrowSmallRight", width: "24px", height: "24px" }) }))) })] }))] })));
|
|
29
29
|
};
|
|
30
30
|
ShoppingCartProduct.defaultProps = {
|
|
31
31
|
insuranceText: "Tamamlayıcı ek güvence ekle",
|
|
@@ -9,6 +9,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
9
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
10
|
exports.ActionButton = exports.ShoppingCartProductStyled = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
-
exports.ShoppingCartProductStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\n a {\n text-decoration: none;\n color: inherit;\n } \n\n .inner {\n display: grid;\n grid-template-columns: auto 1fr auto;\n align-items: center;\n position: relative;\n z-index: 5;\n .img {\n width: 96px;\n height: 96px;\n border: 1px solid var(--dark-opacity-5);\n border-radius: 8px;\n position: relative;\n margin-right: 1rem;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n background: white;\n }\n .text{\n padding-right: 0.5rem;\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 19px;\n word-break: break-word;\n margin-bottom: 0.5rem;\n &:hover{\n color: var(--primary);\n }\n }\n\n .productCardDeliveryText {\n margin-top: 0.5rem;\n margin-bottom: 0;\n color:
|
|
12
|
+
exports.ShoppingCartProductStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\n a {\n text-decoration: none;\n color: inherit;\n } \n\n .inner {\n display: grid;\n grid-template-columns: auto 1fr auto;\n align-items: center;\n position: relative;\n z-index: 5;\n .img {\n width: 96px;\n height: 96px;\n border: 1px solid var(--dark-opacity-5);\n border-radius: 8px;\n position: relative;\n margin-right: 1rem;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n background: white;\n }\n .text{\n padding-right: 0.5rem;\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 19px;\n word-break: break-word;\n margin-bottom: 0.5rem;\n &:hover{\n color: var(--primary-hover);\n }\n }\n\n .productCardDeliveryText {\n margin-top: 0.5rem;\n margin-bottom: 0;\n color: var(--grey-40);\n display: block;\n overflow: hidden;\n .productCardDeliveryDanger{\n display: block;\n color: var(--red);\n }\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\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 }\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\n .price, .period {\n text-decoration: line-through;\n }\n }\n\n .newPrice {\n\n }\n }\n }\n .actions{\n width: 32px;\n height: 92px;\n background-color: var(--dark-opacity-3);\n border-radius: 0.5rem;\n text-align: center;\n display: grid;\n align-content: space-between;\n justify-content: center;\n padding: 4px 0;\n .quantity{\n > div{\n margin: 0 auto;\n }\n }\n }\n }\n .insurance{\n position: relative;\n margin-top: 1.5rem;\n display: grid;\n grid-template-columns: auto 1fr auto;\n align-items: center;\n padding-right: 4px;\n &:before{\n content: \"\";\n position: absolute;\n left: 47px;\n bottom: 100%;\n width: 1px;\n background-color: var(--dark-opacity-5);\n height: 40px;\n }\n .insuranceImg{\n width: 96px;\n height: 40px;\n border: 1px solid var(--dark-opacity-5);\n border-radius: 8px;\n position: relative;\n margin-right: 16px;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .text{\n display: block;\n .price{\n display: block;\n .quantity{\n display: inline-block;\n margin-left: 0.5rem;\n }\n }\n }\n .actions{\n }\n }\n"], ["\n\n a {\n text-decoration: none;\n color: inherit;\n } \n\n .inner {\n display: grid;\n grid-template-columns: auto 1fr auto;\n align-items: center;\n position: relative;\n z-index: 5;\n .img {\n width: 96px;\n height: 96px;\n border: 1px solid var(--dark-opacity-5);\n border-radius: 8px;\n position: relative;\n margin-right: 1rem;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n background: white;\n }\n .text{\n padding-right: 0.5rem;\n .productCardTitle {\n display: block;\n color: var(--dark);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n height: 19px;\n word-break: break-word;\n margin-bottom: 0.5rem;\n &:hover{\n color: var(--primary-hover);\n }\n }\n\n .productCardDeliveryText {\n margin-top: 0.5rem;\n margin-bottom: 0;\n color: var(--grey-40);\n display: block;\n overflow: hidden;\n .productCardDeliveryDanger{\n display: block;\n color: var(--red);\n }\n }\n\n .productCardPriceContent {\n display: grid;\n align-items: ", ";\n justify-content: flex-start;\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 }\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\n .price, .period {\n text-decoration: line-through;\n }\n }\n\n .newPrice {\n\n }\n }\n }\n .actions{\n width: 32px;\n height: 92px;\n background-color: var(--dark-opacity-3);\n border-radius: 0.5rem;\n text-align: center;\n display: grid;\n align-content: space-between;\n justify-content: center;\n padding: 4px 0;\n .quantity{\n > div{\n margin: 0 auto;\n }\n }\n }\n }\n .insurance{\n position: relative;\n margin-top: 1.5rem;\n display: grid;\n grid-template-columns: auto 1fr auto;\n align-items: center;\n padding-right: 4px;\n &:before{\n content: \"\";\n position: absolute;\n left: 47px;\n bottom: 100%;\n width: 1px;\n background-color: var(--dark-opacity-5);\n height: 40px;\n }\n .insuranceImg{\n width: 96px;\n height: 40px;\n border: 1px solid var(--dark-opacity-5);\n border-radius: 8px;\n position: relative;\n margin-right: 16px;\n overflow: hidden;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .text{\n display: block;\n .price{\n display: block;\n .quantity{\n display: inline-block;\n margin-left: 0.5rem;\n }\n }\n }\n .actions{\n }\n }\n"])), function (props) { return props.discountRate ? 'center' : 'end'; }, function (props) { return props.discountRate ? 'auto 1fr' : '1fr'; });
|
|
13
13
|
exports.ActionButton = styled_components_1.default.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border:0;\n padding: 0;\n outline: none;\n box-shadow: none;\n width: 24px;\n height: 24px;\n background: white;\n border-radius: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all .1s ease;\n cursor: pointer;\n position: relative;\n /*&:hover{\n .popup{\n opacity: 1;\n }\n }*/\n &:disabled{\n cursor: no-drop;\n }\n .popup{\n position: absolute;\n width: 139px;\n padding: 1rem;\n border-radius: 0.5rem;\n background-color: var(--red);\n z-index: 99999;\n box-sizing: border-box;\n right: calc(100% + 11px);\n top: -8px;\n color: white;\n //opacity: 0;\n opacity: 1;\n user-select: none;\n pointer-events: none;\n transition: all .1s ease;\n text-align: center;\n &:before {\n content: '';\n position: absolute;\n top: 14px;\n left: calc(100% - 7px);\n transform: rotate(45deg);\n background-color: var(--red);\n width: 12px;\n height: 12px;\n border-radius: 3px;\n }\n }\n svg{\n display: block;\n path, rect{\n stroke : var(--primary);\n transition: all .1s ease;\n }\n }\n &:hover{\n background-color : var(--primary);\n svg{\n path, rect{\n stroke : white;\n }\n }\n }\n"], ["\n border:0;\n padding: 0;\n outline: none;\n box-shadow: none;\n width: 24px;\n height: 24px;\n background: white;\n border-radius: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all .1s ease;\n cursor: pointer;\n position: relative;\n /*&:hover{\n .popup{\n opacity: 1;\n }\n }*/\n &:disabled{\n cursor: no-drop;\n }\n .popup{\n position: absolute;\n width: 139px;\n padding: 1rem;\n border-radius: 0.5rem;\n background-color: var(--red);\n z-index: 99999;\n box-sizing: border-box;\n right: calc(100% + 11px);\n top: -8px;\n color: white;\n //opacity: 0;\n opacity: 1;\n user-select: none;\n pointer-events: none;\n transition: all .1s ease;\n text-align: center;\n &:before {\n content: '';\n position: absolute;\n top: 14px;\n left: calc(100% - 7px);\n transform: rotate(45deg);\n background-color: var(--red);\n width: 12px;\n height: 12px;\n border-radius: 3px;\n }\n }\n svg{\n display: block;\n path, rect{\n stroke : var(--primary);\n transition: all .1s ease;\n }\n }\n &:hover{\n background-color : var(--primary);\n svg{\n path, rect{\n stroke : white;\n }\n }\n }\n"])));
|
|
14
14
|
var templateObject_1, templateObject_2;
|
|
@@ -38,7 +38,7 @@ exports.Default = {
|
|
|
38
38
|
oldPricePeriod: "hafta",
|
|
39
39
|
quantity: 1,
|
|
40
40
|
period: "hafta",
|
|
41
|
-
|
|
41
|
+
deliveryDangerText: "Tahmini teslim değişti",
|
|
42
42
|
onRemove: function () { return console.log("onRemove event"); },
|
|
43
43
|
onIncrement: function () { return console.log("onIncrement event"); },
|
|
44
44
|
onDecrement: function () { return console.log("onDecrement event"); },
|
|
@@ -49,6 +49,7 @@ exports.Default = {
|
|
|
49
49
|
errorText: "Bu üründen daha fazla sepetinize ekleyemezsiniz.",
|
|
50
50
|
insuranceText: "Tamamlayıcı ek güvence ekle",
|
|
51
51
|
insurancePrice: "",
|
|
52
|
+
insuranceQuantity: "",
|
|
52
53
|
hasInsurance: true,
|
|
53
54
|
hasInsuranceTooltip: false,
|
|
54
55
|
insuranceTooltipText: (0, jsx_runtime_1.jsx)("div", { children: "\u00D6nceki kiralaman ek g\u00FCvenceli oldu\u011Fu i\u00E7in, s\u00FCre uzat\u0131rken de ek g\u00FCvencen otomatik olarak eklenir" }),
|
|
@@ -9,14 +9,14 @@ var Tooltip_styled_1 = require("./Tooltip.styled");
|
|
|
9
9
|
var Icon_1 = __importDefault(require("../Icon/Icon"));
|
|
10
10
|
var useOnClickOutside_1 = __importDefault(require("../../hooks/useOnClickOutside"));
|
|
11
11
|
var Tooltip = function (props) {
|
|
12
|
-
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;
|
|
12
|
+
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;
|
|
13
13
|
var _a = (0, react_1.useState)(isOpen), isOpenTooltip = _a[0], setIsOpenTooltip = _a[1];
|
|
14
14
|
(0, react_1.useEffect)(function () {
|
|
15
15
|
setIsOpenTooltip(isOpen);
|
|
16
16
|
}, [isOpen]);
|
|
17
17
|
var tooltipRef = (0, react_1.useRef)();
|
|
18
18
|
(0, useOnClickOutside_1.default)(tooltipRef, function () { return setIsOpenTooltip(false); }, hasCloseOnOutsideClick);
|
|
19
|
-
return ((0, jsx_runtime_1.jsxs)(Tooltip_styled_1.TooltipStyled, { ref: tooltipRef, hasClickAction: hasClickAction, children: [(0, jsx_runtime_1.jsx)(Tooltip_styled_1.Selector, { hasClickAction: hasClickAction, onClick: function () { return setIsOpenTooltip(!isOpenTooltip); }, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "InfoSquare", width: iconWidth, height: iconHeight }) }), (0, jsx_runtime_1.jsxs)(Tooltip_styled_1.Popup, { iconWidth: iconWidth, position: position, popupWidth: popupWidth, isOpen: isOpenTooltip, hasClickAction: hasClickAction, className: "caption-medium-11-13", children: [title && (0, jsx_runtime_1.jsx)(Tooltip_styled_1.Title, { className: "body-extra-bold-13-16", children: title }), children] })] }));
|
|
19
|
+
return ((0, jsx_runtime_1.jsxs)(Tooltip_styled_1.TooltipStyled, { ref: tooltipRef, hasClickAction: hasClickAction, children: [(0, jsx_runtime_1.jsx)(Tooltip_styled_1.Selector, { isOpen: isOpenTooltip, position: position, hasClickAction: hasClickAction, onClick: function () { return setIsOpenTooltip(!isOpenTooltip); }, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "InfoSquare", width: iconWidth, height: iconHeight }) }), (0, jsx_runtime_1.jsxs)(Tooltip_styled_1.Popup, { popupSize: popupSize, iconWidth: iconWidth, position: position, popupWidth: popupWidth, isOpen: isOpenTooltip, hasClickAction: hasClickAction, className: "caption-medium-11-13", popupLeft: popupLeft, popupRight: popupRight, popupTop: popupTop, popupBottom: popupBottom, children: [title && (0, jsx_runtime_1.jsx)(Tooltip_styled_1.Title, { className: "body-extra-bold-13-16", children: title }), children] })] }));
|
|
20
20
|
};
|
|
21
21
|
Tooltip.defaultProps = {
|
|
22
22
|
iconWidth: "16px",
|
|
@@ -10,42 +10,51 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
10
10
|
exports.Popup = exports.Title = exports.Selector = exports.TooltipStyled = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
12
|
var devices_1 = require("../../constants/devices");
|
|
13
|
-
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 }\n }\n "; });
|
|
14
|
-
exports.Selector = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: block;\n cursor: ", ";\n
|
|
15
|
-
exports.Title = styled_components_1.default.strong(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n margin-bottom: 0.5rem;\n"], ["\n display: block;\n margin-bottom: 0.5rem;\n"])));
|
|
16
|
-
exports.Popup = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n\n position: absolute;\n width: ", ";\n padding: 0.5rem;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n z-index: 99999;\n box-sizing: border-box;\n ", ";\n user-select: none;\n pointer-events: none;\n transition: all 0.15s ease;\n opacity: ", ";\n\n @media only screen and ", " {\n left: auto;\n transform: none;\n right: -1.2rem;\n padding: 0.5rem;\n &:before {\n left: auto !important;\n transform: rotate(45deg) !important;\n right: ", " !important;\n }\n }\n\n &:before {\n content: '';\n position: absolute;\n\n ", ";\n background-color: var(--primary-opacity-10);\n width: 12px;\n height: 12px;\n border-radius: 3px;\n }\n"], ["\n\n position: absolute;\n width: ", ";\n padding: 0.5rem;\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-10);\n z-index: 99999;\n box-sizing: border-box;\n ", ";\n user-select: none;\n pointer-events: none;\n transition: all 0.15s ease;\n opacity: ", ";\n\n @media only screen and ", " {\n left: auto;\n transform: none;\n right: -1.2rem;\n padding: 0.5rem;\n &:before {\n left: auto !important;\n transform: rotate(45deg) !important;\n right: ", " !important;\n }\n }\n\n &:before {\n content: '';\n position: absolute;\n\n ", ";\n background-color: var(--primary-opacity-10);\n width: 12px;\n height: 12px;\n border-radius: 3px;\n }\n"])), function (props) { return props.popupWidth ? props.popupWidth : "151px"; }, function (props) {
|
|
13
|
+
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 "; });
|
|
14
|
+
exports.Selector = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: block;\n cursor: ", ";\n position: relative;\n svg {\n display: block;\n\n path {\n stroke: var(--primary);\n }\n }\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 svg {\n display: block;\n\n path {\n stroke: var(--primary);\n }\n }\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 && props.isOpen) ? '1' : "0"; }, function (props) {
|
|
17
15
|
switch (props.position) {
|
|
18
16
|
case 'bottomRight':
|
|
19
|
-
return "\n
|
|
17
|
+
return "\n top: calc(100% + 4px);\n ";
|
|
20
18
|
case 'bottomCenter':
|
|
21
|
-
return "\n
|
|
19
|
+
return "\n top: calc(100% + 4px);\n ";
|
|
22
20
|
case 'bottomLeft':
|
|
23
|
-
return "\n
|
|
21
|
+
return "\n top: calc(100% + 4px);\n ";
|
|
24
22
|
case 'topRight':
|
|
25
|
-
return "\n
|
|
23
|
+
return "\n bottom: calc(100% + 4px);\n ";
|
|
26
24
|
case 'topCenter':
|
|
27
|
-
return "\n
|
|
25
|
+
return "\n bottom: calc(100% + 4px);\n ";
|
|
28
26
|
case 'topLeft':
|
|
29
|
-
return "\n
|
|
27
|
+
return "\n bottom: calc(100% + 4px);\n ";
|
|
30
28
|
default:
|
|
31
|
-
return "\n
|
|
29
|
+
return "\n bottom: calc(100% + 4px);\n ";
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
exports.Title = styled_components_1.default.strong(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n margin-bottom: 0.5rem;\n"], ["\n display: block;\n margin-bottom: 0.5rem;\n"])));
|
|
33
|
+
exports.Popup = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: absolute;\n width: ", ";\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 ", ";\n\n @media only screen and ", " {\n left: auto;\n transform: none;\n right: -1.5rem;\n padding: 0.5rem;\n &:before {\n left: auto !important;\n transform: rotate(45deg) !important;\n right: ", " !important;\n }\n }\n"], ["\n position: absolute;\n width: ", ";\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 ", ";\n\n @media only screen and ", " {\n left: auto;\n transform: none;\n right: -1.5rem;\n padding: 0.5rem;\n &:before {\n left: auto !important;\n transform: rotate(45deg) !important;\n right: ", " !important;\n }\n }\n"])), function (props) { return props.popupWidth ? props.popupWidth : "151px"; }, function (props) {
|
|
34
|
+
switch (props.popupSize) {
|
|
35
|
+
case 'small':
|
|
36
|
+
return "10px";
|
|
37
|
+
case 'medium':
|
|
38
|
+
return "1rem";
|
|
39
|
+
default:
|
|
40
|
+
return "10px";
|
|
32
41
|
}
|
|
33
|
-
}, function (props) { return (props.hasClickAction && props.isOpen) ? '1' : "0"; },
|
|
42
|
+
}, function (props) { return (props.hasClickAction && props.isOpen) ? '1' : "0"; }, function (props) {
|
|
34
43
|
switch (props.position) {
|
|
35
44
|
case 'bottomRight':
|
|
36
|
-
return "\n
|
|
45
|
+
return "\n right: ".concat(props.popupRight || '-22px', ";\n top: calc(100% + 10px);\n ");
|
|
37
46
|
case 'bottomCenter':
|
|
38
|
-
return "\n
|
|
47
|
+
return "\n left: 50%;\n top: calc(100% + 10px);\n transform: translateX(-50%);\n ";
|
|
39
48
|
case 'bottomLeft':
|
|
40
|
-
return "\n
|
|
49
|
+
return "\n left: ".concat(props.popupLeft || '-22px', ";\n top: calc(100% + 10px);\n ");
|
|
41
50
|
case 'topRight':
|
|
42
|
-
return "\n
|
|
51
|
+
return "\n right: ".concat(props.popupRight || '-22px', ";\n bottom: calc(100% + 10px);\n ");
|
|
43
52
|
case 'topCenter':
|
|
44
|
-
return "\n
|
|
53
|
+
return "\n left: 50%;\n bottom: calc(100% + 10px);\n transform: translateX(-50%);\n ";
|
|
45
54
|
case 'topLeft':
|
|
46
|
-
return "\n
|
|
55
|
+
return "\n left: ".concat(props.popupLeft || '-22px', ";\n bottom: calc(100% + 10px);\n ");
|
|
47
56
|
default:
|
|
48
|
-
return "\n
|
|
57
|
+
return "\n left: 50%;\n bottom: calc(100% + 10px);\n transform: translateX(-50%);\n ";
|
|
49
58
|
}
|
|
50
|
-
});
|
|
59
|
+
}, devices_1.devices.xl, function (props) { return props.iconWidth === "16px" ? "27px" : "30px"; });
|
|
51
60
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.positions = void 0;
|
|
3
|
+
exports.sizes = exports.positions = void 0;
|
|
4
4
|
exports.positions = ['bottomRight', 'bottomCenter', 'bottomLeft', 'topRight', 'topCenter', 'topLeft'];
|
|
5
|
+
exports.sizes = ['small', 'medium'];
|
|
@@ -24,6 +24,7 @@ exports.default = {
|
|
|
24
24
|
tags: ['autodocs'],
|
|
25
25
|
argTypes: {
|
|
26
26
|
position: { control: 'select', options: props_1.positions },
|
|
27
|
+
popupSize: { control: 'select', options: props_1.sizes },
|
|
27
28
|
}
|
|
28
29
|
};
|
|
29
30
|
exports.Default = {
|
|
@@ -35,5 +36,10 @@ exports.Default = {
|
|
|
35
36
|
hasCloseOnOutsideClick: false,
|
|
36
37
|
iconWidth: "16px",
|
|
37
38
|
iconHeight: "16px",
|
|
39
|
+
popupSize: "small",
|
|
40
|
+
popupLeft: "",
|
|
41
|
+
popupRight: "",
|
|
42
|
+
popupTop: "",
|
|
43
|
+
popupBottom: "",
|
|
38
44
|
},
|
|
39
45
|
};
|