krl-alfred 1.76.25 → 1.76.27

package/dist/components/AutocompleteInput/AutocompleteInput.styled.js

@@ -11,6 +11,6 @@ exports.DropdownInnerStyled = exports.DropdownStyled = exports.InputStyled = exp
 var styled_components_1 = __importDefault(require("styled-components"));
 exports.Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font:var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    p {\n      margin: 0;\n      color: var(--dark-opacity-50);\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n    .hiddenInput{\n        opacity: 0;\n        user-select: none;\n        pointer-events: none;\n        position: absolute;\n        left: 0;\n        width: 0;\n    }\n    .inputIcon {\n      position: absolute;\n      top: 50%;\n      right: 24px;\n      transform: translateY(-50%);\n      cursor: pointer;\n      div{\n        display: block;\n      }\n    }\n  }\n\n  .error {\n      display: flex;\n      align-items: center;\n      margin-top: 8px;\n      color: var(--red);\n      svg {\n          margin-right: 8px;\n      }\n\n      p {\n          margin: 0;\n          font:var(--caption-semi-bold-11-13);\n      }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font:var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    p {\n      margin: 0;\n      color: var(--dark-opacity-50);\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n    .hiddenInput{\n        opacity: 0;\n        user-select: none;\n        pointer-events: none;\n        position: absolute;\n        left: 0;\n        width: 0;\n    }\n    .inputIcon {\n      position: absolute;\n      top: 50%;\n      right: 24px;\n      transform: translateY(-50%);\n      cursor: pointer;\n      div{\n        display: block;\n      }\n    }\n  }\n\n  .error {\n      display: flex;\n      align-items: center;\n      margin-top: 8px;\n      color: var(--red);\n      svg {\n          margin-right: 8px;\n      }\n\n      p {\n          margin: 0;\n          font:var(--caption-semi-bold-11-13);\n      }\n  }\n"])), function (props) { return props.width || '370px'; });
 exports.InputStyled = styled_components_1.default.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  box-sizing: border-box;\n  width: 100%;\n  height: 56px;\n  background: ", ";\n  border-radius: ", ";\n  border: ", ";\n  padding: ", ";\n  color: ", ";\n  font : var(--body-semi-bold-14-17);\n  outline: none;\n  user-select: ", ";\n  pointer-events: ", ";\n  text-transform: uppercase;\n  &::placeholder {\n    color: ", ";\n    text-transform: initial;\n  }\n  &:focus {\n    padding: 18.5px 23px;\n    border: 2px solid ", ";\n    color: ", ";\n    background: white;\n  }\n  &:is([disabled]){\n    color: var(--dark-opacity-25);\n  }\n\n"], ["\n  box-sizing: border-box;\n  width: 100%;\n  height: 56px;\n  background: ", ";\n  border-radius: ", ";\n  border: ", ";\n  padding: ", ";\n  color: ", ";\n  font : var(--body-semi-bold-14-17);\n  outline: none;\n  user-select: ", ";\n  pointer-events: ", ";\n  text-transform: uppercase;\n  &::placeholder {\n    color: ", ";\n    text-transform: initial;\n  }\n  &:focus {\n    padding: 18.5px 23px;\n    border: 2px solid ", ";\n    color: ", ";\n    background: white;\n  }\n  &:is([disabled]){\n    color: var(--dark-opacity-25);\n  }\n\n"])), function (props) { return props.disabled ? 'var(--dark-opacity-5)' : (props.hasError ? 'white' : 'var(--dark-opacity-3)'); }, function (props) { return props.isShowDropdown ? '8px 8px 0 0' : '8px 8px 8px 8px'; }, function (props) { return props.hasError ? '2px solid var(--red)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.hasError ? '18.5px 23px' : '19.5px 24px'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; }, function (props) { return props.readonly ? 'none' : 'initial'; }, function (props) { return props.readonly ? 'none' : 'initial'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark-opacity-50)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--primary)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; });
-exports.DropdownStyled = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    border-radius: 0 0 8px 8px;\n    box-shadow: none;\n    border: 1px solid var(--dark-opacity-10);\n    overflow: hidden;\n    max-height: ", ";\n    border-top: 0;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    right: 0;\n    z-index: 10;\n    padding: 0;\n    margin: 0;\n    [data-simplebar] {\n        height: auto !important;\n        max-height: ", " !important;\n        padding: 0 !important;\n        .simplebar-track.simplebar-vertical {\n            width: 9px !important;\n        }\n    }\n"], ["\n    border-radius: 0 0 8px 8px;\n    box-shadow: none;\n    border: 1px solid var(--dark-opacity-10);\n    overflow: hidden;\n    max-height: ", ";\n    border-top: 0;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    right: 0;\n    z-index: 10;\n    padding: 0;\n    margin: 0;\n    [data-simplebar] {\n        height: auto !important;\n        max-height: ", " !important;\n        padding: 0 !important;\n        .simplebar-track.simplebar-vertical {\n            width: 9px !important;\n        }\n    }\n"])), function (props) { return props.dropdownMaxHeight && props.dropdownMaxHeight; }, function (props) { return props.dropdownMaxHeight && props.dropdownMaxHeight; });
+exports.DropdownStyled = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    border-radius: 0 0 8px 8px;\n    box-shadow: none;\n    border: 1px solid var(--dark-opacity-10);\n    overflow: hidden;\n    max-height: ", ";\n    border-top: 0;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    right: 0;\n    z-index: 10;\n    padding: 0;\n    margin: 0;\n    background-color: white;\n    [data-simplebar] {\n        height: auto !important;\n        max-height: ", " !important;\n        padding: 0 !important;\n        .simplebar-track.simplebar-vertical {\n            width: 9px !important;\n        }\n    }\n"], ["\n    border-radius: 0 0 8px 8px;\n    box-shadow: none;\n    border: 1px solid var(--dark-opacity-10);\n    overflow: hidden;\n    max-height: ", ";\n    border-top: 0;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    right: 0;\n    z-index: 10;\n    padding: 0;\n    margin: 0;\n    background-color: white;\n    [data-simplebar] {\n        height: auto !important;\n        max-height: ", " !important;\n        padding: 0 !important;\n        .simplebar-track.simplebar-vertical {\n            width: 9px !important;\n        }\n    }\n"])), function (props) { return props.dropdownMaxHeight && props.dropdownMaxHeight; }, function (props) { return props.dropdownMaxHeight && props.dropdownMaxHeight; });
 exports.DropdownInnerStyled = styled_components_1.default.ul(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    position: relative;\n    > li {\n        height: 51px;\n        padding: 0 1.5rem;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        background-color: #fff;\n        position: relative;\n        color: var(--dark);\n        cursor: pointer;\n        box-sizing: border-box;\n        font : var(--title-bold-16-19);\n        &:not(.hasNoResult):hover{\n            background-color: var(--dark-opacity-3);\n        }\n        &:is(.isSelected){\n            background-color: var(--dark-opacity-3);\n        }\n        &.isFixedBottom{\n            color: var(--dark-opacity-50);\n            position: sticky;\n            bottom: 0;\n            left: 0;\n            right: 0;\n            z-index: 4;\n        }\n        &.hasNoResult{\n            cursor: initial;\n            height: auto;\n        }\n    }\n"], ["\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    position: relative;\n    > li {\n        height: 51px;\n        padding: 0 1.5rem;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        background-color: #fff;\n        position: relative;\n        color: var(--dark);\n        cursor: pointer;\n        box-sizing: border-box;\n        font : var(--title-bold-16-19);\n        &:not(.hasNoResult):hover{\n            background-color: var(--dark-opacity-3);\n        }\n        &:is(.isSelected){\n            background-color: var(--dark-opacity-3);\n        }\n        &.isFixedBottom{\n            color: var(--dark-opacity-50);\n            position: sticky;\n            bottom: 0;\n            left: 0;\n            right: 0;\n            z-index: 4;\n        }\n        &.hasNoResult{\n            cursor: initial;\n            height: auto;\n        }\n    }\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/components/ReviewCard/ReviewCard.js

@@ -28,7 +28,7 @@ var ReviewCard_styled_1 = require("./ReviewCard.styled");
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var classnames_1 = __importDefault(require("classnames"));
 var ReviewCard = function (props) {
-    return ((0, jsx_runtime_1.jsx)(ReviewCard_styled_1.ReviewCardStyled, { children: (0, jsx_runtime_1.jsxs)("a", __assign({ href: props.link, target: "_blank" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "imgWrapper" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "img" }, { children: props.image })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "detail" }, { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: props.title })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "stars" }, { children: __spreadArray([], Array(props.totalStar), true).map(function (value, key) { return ((0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('star', { 'isFilled': key < props.star }) }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: key < props.star ? 'var(--yellow)' : 'var(--dark-opacity-10)', name: "Star", width: "12px", height: "12px" }) }), key)); }) }))] }))] })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "description" }, { children: props.description })), (0, jsx_runtime_1.jsx)("div", { className: "line" }), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "bottom" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "name" }, { children: props.name })), (0, jsx_runtime_1.jsx)("div", { className: "horizontalLine" }), (0, jsx_runtime_1.jsx)("div", __assign({ className: "logo" }, { children: props.logo }))] }))] })) }));
+    return ((0, jsx_runtime_1.jsx)(ReviewCard_styled_1.ReviewCardStyled, __assign({ onClick: props.onClick }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "imgWrapper" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "img" }, { children: props.image })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "detail" }, { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: props.title })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "stars" }, { children: __spreadArray([], Array(props.totalStar), true).map(function (value, key) { return ((0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('star', { 'isFilled': key < props.star }) }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: key < props.star ? 'var(--yellow)' : 'var(--dark-opacity-10)', name: "Star", width: "12px", height: "12px" }) }), key)); }) }))] }))] })), (0, jsx_runtime_1.jsx)("div", __assign({ className: "description" }, { children: props.description })), (0, jsx_runtime_1.jsx)("div", { className: "line" }), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "bottom" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "name" }, { children: props.name })), (0, jsx_runtime_1.jsx)("div", { className: "horizontalLine" }), (0, jsx_runtime_1.jsx)("div", __assign({ className: "logo" }, { children: props.logo }))] }))] }) })));
 };
 ReviewCard.defaultProps = {
     totalStar: 5

package/dist/components/ReviewCard/ReviewCard.styled.js

@@ -9,5 +9,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ReviewCardStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
-exports.ReviewCardStyled = 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-opacity-25);\n    }\n    .imgWrapper{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .img{\n            width: 64px;\n            height: 64px;\n            border: 1px solid var(--dark-opacity-5);\n            border-radius: 0.5rem;\n            position: relative;\n            margin-right: 1rem;\n            overflow: hidden;\n            box-sizing: border-box;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 1 0 auto;\n            max-width: 64px;\n            * {\n                display: block !important;\n            }\n        }\n        .detail{\n            .title{\n                margin-bottom: 0.5rem;\n                display: -webkit-box;\n                -webkit-line-clamp: 1;\n                -webkit-box-orient: vertical;\n                overflow: hidden;\n                color: var(--dark-opacity-75);\n                font : var(--body-bold-14-17);\n            }\n            .stars{\n                display: flex;\n                align-items: center;\n                justify-content: flex-start;\n                .star{\n                    + .star{\n                        margin-left: 1px;\n                    }\n                    div{\n                        display: block;\n                    }\n                }\n            }\n        }\n    }\n    .description{\n        font: var(--body-medium-14-17);\n        color: var(--dark-opacity-75);\n        margin: 1rem 0 1.5rem 0;\n        overflow: hidden;\n        position: relative;\n        min-height: 68px;\n        display: -webkit-box;\n        -webkit-line-clamp: 4;\n        -webkit-box-orient: vertical;\n    }\n    .line{\n        border-bottom: 1px solid var(--icon-shadow-color);\n        margin-bottom: 1rem;\n    }\n    .bottom{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .name{\n            font: var(--caption-medium-10-12);\n            color: var(--dark-opacity-75);\n        }\n        .horizontalLine{\n            border-right: 1px solid var(--dark-opacity-75);\n            height: 0.5rem;\n            margin: 0 0.5rem;\n        }\n        .logo{\n            * {\n                display: block !important;\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-opacity-25);\n    }\n    .imgWrapper{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .img{\n            width: 64px;\n            height: 64px;\n            border: 1px solid var(--dark-opacity-5);\n            border-radius: 0.5rem;\n            position: relative;\n            margin-right: 1rem;\n            overflow: hidden;\n            box-sizing: border-box;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 1 0 auto;\n            max-width: 64px;\n            * {\n                display: block !important;\n            }\n        }\n        .detail{\n            .title{\n                margin-bottom: 0.5rem;\n                display: -webkit-box;\n                -webkit-line-clamp: 1;\n                -webkit-box-orient: vertical;\n                overflow: hidden;\n                color: var(--dark-opacity-75);\n                font : var(--body-bold-14-17);\n            }\n            .stars{\n                display: flex;\n                align-items: center;\n                justify-content: flex-start;\n                .star{\n                    + .star{\n                        margin-left: 1px;\n                    }\n                    div{\n                        display: block;\n                    }\n                }\n            }\n        }\n    }\n    .description{\n        font: var(--body-medium-14-17);\n        color: var(--dark-opacity-75);\n        margin: 1rem 0 1.5rem 0;\n        overflow: hidden;\n        position: relative;\n        min-height: 68px;\n        display: -webkit-box;\n        -webkit-line-clamp: 4;\n        -webkit-box-orient: vertical;\n    }\n    .line{\n        border-bottom: 1px solid var(--icon-shadow-color);\n        margin-bottom: 1rem;\n    }\n    .bottom{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .name{\n            font: var(--caption-medium-10-12);\n            color: var(--dark-opacity-75);\n        }\n        .horizontalLine{\n            border-right: 1px solid var(--dark-opacity-75);\n            height: 0.5rem;\n            margin: 0 0.5rem;\n        }\n        .logo{\n            * {\n                display: block !important;\n            }\n        }\n    }\n"])));
+exports.ReviewCardStyled = 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    cursor: pointer;\n    &:hover{\n        box-shadow: 0 4px 15px 0 var(--dark-opacity-25);\n    }\n    .imgWrapper{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .img{\n            width: 64px;\n            height: 64px;\n            border: 1px solid var(--dark-opacity-5);\n            border-radius: 0.5rem;\n            position: relative;\n            margin-right: 1rem;\n            overflow: hidden;\n            box-sizing: border-box;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 1 0 auto;\n            max-width: 64px;\n            * {\n                display: block !important;\n            }\n        }\n        .detail{\n            .title{\n                margin-bottom: 0.5rem;\n                display: -webkit-box;\n                -webkit-line-clamp: 1;\n                -webkit-box-orient: vertical;\n                overflow: hidden;\n                color: var(--dark-opacity-75);\n                font : var(--body-bold-14-17);\n            }\n            .stars{\n                display: flex;\n                align-items: center;\n                justify-content: flex-start;\n                .star{\n                    + .star{\n                        margin-left: 1px;\n                    }\n                    div{\n                        display: block;\n                    }\n                }\n            }\n        }\n    }\n    .description{\n        font: var(--body-medium-14-17);\n        color: var(--dark-opacity-75);\n        margin: 1rem 0 1.5rem 0;\n        overflow: hidden;\n        position: relative;\n        min-height: 68px;\n        display: -webkit-box;\n        -webkit-line-clamp: 4;\n        -webkit-box-orient: vertical;\n    }\n    .line{\n        border-bottom: 1px solid var(--icon-shadow-color);\n        margin-bottom: 1rem;\n    }\n    .bottom{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .name{\n            font: var(--caption-medium-10-12);\n            color: var(--dark-opacity-75);\n        }\n        .horizontalLine{\n            border-right: 1px solid var(--dark-opacity-75);\n            height: 0.5rem;\n            margin: 0 0.5rem;\n        }\n        .logo{\n            * {\n                display: block !important;\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    cursor: pointer;\n    &:hover{\n        box-shadow: 0 4px 15px 0 var(--dark-opacity-25);\n    }\n    .imgWrapper{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .img{\n            width: 64px;\n            height: 64px;\n            border: 1px solid var(--dark-opacity-5);\n            border-radius: 0.5rem;\n            position: relative;\n            margin-right: 1rem;\n            overflow: hidden;\n            box-sizing: border-box;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex: 1 0 auto;\n            max-width: 64px;\n            * {\n                display: block !important;\n            }\n        }\n        .detail{\n            .title{\n                margin-bottom: 0.5rem;\n                display: -webkit-box;\n                -webkit-line-clamp: 1;\n                -webkit-box-orient: vertical;\n                overflow: hidden;\n                color: var(--dark-opacity-75);\n                font : var(--body-bold-14-17);\n            }\n            .stars{\n                display: flex;\n                align-items: center;\n                justify-content: flex-start;\n                .star{\n                    + .star{\n                        margin-left: 1px;\n                    }\n                    div{\n                        display: block;\n                    }\n                }\n            }\n        }\n    }\n    .description{\n        font: var(--body-medium-14-17);\n        color: var(--dark-opacity-75);\n        margin: 1rem 0 1.5rem 0;\n        overflow: hidden;\n        position: relative;\n        min-height: 68px;\n        display: -webkit-box;\n        -webkit-line-clamp: 4;\n        -webkit-box-orient: vertical;\n    }\n    .line{\n        border-bottom: 1px solid var(--icon-shadow-color);\n        margin-bottom: 1rem;\n    }\n    .bottom{\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        .name{\n            font: var(--caption-medium-10-12);\n            color: var(--dark-opacity-75);\n        }\n        .horizontalLine{\n            border-right: 1px solid var(--dark-opacity-75);\n            height: 0.5rem;\n            margin: 0 0.5rem;\n        }\n        .logo{\n            * {\n                display: block !important;\n            }\n        }\n    }\n"])));
 var templateObject_1;

package/package.json

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