krl-alfred 1.82.9 → 1.82.11
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.
|
@@ -10,5 +10,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
10
10
|
exports.BlogCardStyled = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
12
|
var devices_1 = require("../../constants/devices");
|
|
13
|
-
exports.BlogCardStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$direction === "horizontal" ? "\n display: grid;\n align-items: center;\n justify-content: space-between;\n grid-template-columns: 104px 1fr;\n column-gap: 1.5rem;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "100%" : props.$size === "lg" ? "71.9%" : "58.2%"; }, function (props) { return props.$direction === "horizontal" ? "0" : "1.5rem"; }, function (props) { return props.$direction === "horizontal" ? "\n display: flex;\n flex-direction: column-reverse;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "0" : props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$size === "lg" ? "var(--headline-bold-18-22)" : "var(--title-bold-16-19)"; }, function (props) { return props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$direction === "horizontal" ? "3" : props.$size === "lg" ? "2" : "3"; }, function (props) { return props.$size === "lg" ? "
|
|
13
|
+
exports.BlogCardStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"], ["\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n border-radius: 0.5rem;\n padding: 1.5rem;\n transition: all .2s ease;\n &:hover{\n box-shadow: 0 4px 15px 0 var(--dark-shadow-color);\n }\n .author {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-bottom: 1rem;\n\n .img {\n width: 40px;\n height: 40px;\n overflow: hidden;\n border-radius: 50%;\n position: relative;\n\n * {\n display: block !important;\n height: 100% !important;\n width: 100% !important;\n object-fit: cover !important;\n }\n }\n\n .title {\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n margin-left: 0.5rem;\n }\n }\n\n .content {\n ", "\n .contentImg {\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n padding-bottom: ", ";\n margin-bottom: ", ";\n\n > * {\n display: block !important;\n width: 100% !important;\n height: 100% !important;\n position: absolute !important;\n left: 50% !important;\n top: 50% !important;\n transform: translate(-50%, -50%) !important;\n\n img {\n object-fit: cover;\n }\n }\n }\n\n .contentBottom {\n ", "\n .tagWrapper {\n margin-bottom: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n .tags {\n font: var(--caption-semi-bold-12-15);\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n padding-right: 2rem;\n }\n\n .date {\n font: var(--caption-medium-11-13);\n color: var(--grey-50);\n }\n }\n\n .contentTitle {\n font: ", ";\n margin-bottom: ", ";\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: ", ";\n }\n\n .contentDesc {\n display: block;\n font: ", ";\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n ", "\n margin-bottom: ", ";\n }\n }\n }\n\n ", "\n"])), function (props) { return props.$direction === "horizontal" ? "\n display: grid;\n align-items: center;\n justify-content: space-between;\n grid-template-columns: 104px 1fr;\n column-gap: 1.5rem;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "100%" : props.$size === "lg" ? "71.9%" : "58.2%"; }, function (props) { return props.$direction === "horizontal" ? "0" : "1.5rem"; }, function (props) { return props.$direction === "horizontal" ? "\n display: flex;\n flex-direction: column-reverse;\n " : ""; }, function (props) { return props.$direction === "horizontal" ? "0" : props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$size === "lg" ? "var(--headline-bold-18-22)" : "var(--title-bold-16-19)"; }, function (props) { return props.$size === "lg" ? "1.5rem" : "1rem"; }, function (props) { return props.$direction === "horizontal" ? "3" : props.$size === "lg" ? "2" : "3"; }, function (props) { return props.$size === "lg" ? "67px" : "57px"; }, function (props) { return props.$size === "lg" ? "var(--title-regular-16-19)" : "var(--body-regular-14-17)"; }, function (props) { return props.$size === "lg" ? "5" : "3"; }, function (props) { return props.$direction === "horizontal" ? "\n display: none;\n " : ""; }, function (props) { return props.$size === "lg" ? "12px" : "0"; }, function (props) { return props.$size === "lg" ? "\n @media only screen and ".concat(devices_1.devices.lg, " {\n .content{\n display:block;\n .contentImg{\n padding-bottom: 58.2%;\n margin-bottom: 1.5rem;\n }\n .contentBottom{\n display:block;\n .tagWrapper{\n margin-bottom: 1rem;\n }\n .contentTitle {\n font: var(--title-bold-16-19);\n margin-bottom: 1rem;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n min-height: 57px !important;\n }\n \n .contentDesc {\n display: block;\n font: var(--body-regular-14-17);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin-bottom: 0;\n }\n }\n }\n }\n ") : ""; });
|
|
14
14
|
var templateObject_1;
|
|
@@ -38,6 +38,6 @@ var Children = function (props) {
|
|
|
38
38
|
};
|
|
39
39
|
var Button = (0, react_1.forwardRef)(function (props, ref) {
|
|
40
40
|
var type = props.type, isLoading = props.isLoading, onClick = props.onClick, disabled = props.disabled, size = props.size, variant = props.variant, width = props.width, _a = props.icon, icon = _a === void 0 ? props_1.ButtonDefault.icon : _a, children = props.children, _b = props.iconSize, iconSize = _b === void 0 ? props_1.ButtonDefault.iconSize : _b, _c = props.tooltip, tooltip = _c === void 0 ? props_1.ButtonDefault.tooltip : _c, other = __rest(props, ["type", "isLoading", "onClick", "disabled", "size", "variant", "width", "icon", "children", "iconSize", "tooltip"]);
|
|
41
|
-
return ((0, jsx_runtime_1.jsxs)(Button_styled_1.ButtonStyled, __assign({ className: (0, classnames_1.default)({ "loading": isLoading }), onClick: onClick, disabled: disabled, "$size": size, "$variant": variant, "$width": width, "$icon": icon, type: type, ref: ref, "$isLoading": isLoading, "$tooltip": tooltip }, other, { children: [(0, jsx_runtime_1.jsxs)(Children, __assign({ isLoading: isLoading, icon: icon, iconSize: iconSize }, { children: [isLoading && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "loadingContent" }, { children: (0, jsx_runtime_1.jsx)(Loader_1.default, { width: ["small", "xsmall"].includes(size) ? "1rem" : "1.5rem", height: ["small", "xsmall"].includes(size) ? "1rem" : "1.5rem", variant: variant === 'primary' ? 'secondary' : 'primary' }) }))), (0, jsx_runtime_1.jsx)("span", { children: children })] })), tooltip && (0, jsx_runtime_1.jsx)("div", __assign({ className: "buttonTooltip" }, { children: tooltip }))] })));
|
|
41
|
+
return ((0, jsx_runtime_1.jsxs)(Button_styled_1.ButtonStyled, __assign({ className: (0, classnames_1.default)({ "loading": isLoading }), onClick: onClick, disabled: disabled, "$size": size, "$variant": variant, "$width": width, "$icon": icon, type: type, ref: ref, "$isLoading": isLoading, "$tooltip": tooltip }, other, { children: [(0, jsx_runtime_1.jsxs)(Children, __assign({ isLoading: isLoading, icon: icon, iconSize: iconSize }, { children: [isLoading && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "loadingContent" }, { children: (0, jsx_runtime_1.jsx)(Loader_1.default, { width: ["small", "xsmall"].includes(size) ? "1rem" : "1.5rem", height: ["small", "xsmall"].includes(size) ? "1rem" : "1.5rem", variant: variant === 'primary' ? 'secondary' : 'primary' }) }))), children && (0, jsx_runtime_1.jsx)("span", { children: children })] })), tooltip && (0, jsx_runtime_1.jsx)("div", __assign({ className: "buttonTooltip" }, { children: tooltip }))] })));
|
|
42
42
|
});
|
|
43
43
|
exports.default = Button;
|
|
@@ -13,10 +13,10 @@ var __assign = (this && this.__assign) || function () {
|
|
|
13
13
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
14
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
15
15
|
var props_1 = require("./props");
|
|
16
|
-
var
|
|
16
|
+
var index_1 = require("./iconList/index");
|
|
17
17
|
var Icon_styled_1 = require("./Icon.styled");
|
|
18
18
|
var Icon = function (_a) {
|
|
19
19
|
var _b = _a.hasWrapper, hasWrapper = _b === void 0 ? props_1.IconDefault.hasWrapper : _b, _c = _a.color, color = _c === void 0 ? props_1.IconDefault.color : _c, _d = _a.name, name = _d === void 0 ? props_1.IconDefault.name : _d, _e = _a.linear, linear = _e === void 0 ? props_1.IconDefault.linear : _e, _f = _a.hasColorChanged, hasColorChanged = _f === void 0 ? props_1.IconDefault.hasColorChanged : _f, _g = _a.width, width = _g === void 0 ? props_1.IconDefault.width : _g, _h = _a.height, height = _h === void 0 ? props_1.IconDefault.height : _h, _j = _a.wrapperWidth, wrapperWidth = _j === void 0 ? props_1.IconDefault.wrapperWidth : _j, _k = _a.wrapperHeight, wrapperHeight = _k === void 0 ? props_1.IconDefault.wrapperHeight : _k, strokeWidth = _a.strokeWidth;
|
|
20
|
-
return hasWrapper ? ((0, jsx_runtime_1.jsx)(Icon_styled_1.IconWrapper, __assign({ "$linear": linear, "$width": width, "$height": height, "$strokeWidth": strokeWidth, "$color": color, "$hasColorChanged": hasColorChanged }, { children: (0, jsx_runtime_1.jsx)(Icon_styled_1.IconInner, __assign({ "$wrapperWidth": wrapperWidth, "$wrapperHeight": wrapperHeight }, { children:
|
|
20
|
+
return hasWrapper ? ((0, jsx_runtime_1.jsx)(Icon_styled_1.IconWrapper, __assign({ "$linear": linear, "$width": width, "$height": height, "$strokeWidth": strokeWidth, "$color": color, "$hasColorChanged": hasColorChanged }, { children: (0, jsx_runtime_1.jsx)(Icon_styled_1.IconInner, __assign({ "$wrapperWidth": wrapperWidth, "$wrapperHeight": wrapperHeight }, { children: index_1.iconList[name] ? index_1.iconList[name]({}) : index_1.iconList["Danger"]({}) })) }))) : (index_1.iconList[name] ? index_1.iconList[name]({ width: width, height: height, color: color }) : index_1.iconList["Danger"]({}));
|
|
21
21
|
};
|
|
22
22
|
exports.default = Icon;
|